i am working on billing project, now i do to add new row by clone method successfully and trying to edit and remove new clone row ,but i don't know how to get value from this clone rows TextBox and dropdownlist
because if i try to remove a row i need to less the same rows total value from netTotal and replase the stock qty to stock tabel
please help me to solve this problam
What I have tried:
html page
@model WorkingPlace.Models.PerchesDetail
@{
ViewBag.Title = "NewPerches";
}
<h4>New Perches Transation </h4>
<!DOCTYPE html>
<html>
<head>
<style>
.detail {
display: none;
}
</style>
<style>
.mtot {
display: none;
}
</style>
<style>
.bt1 {
display: none;
}
</style>
</head>
<body>
<div class="container">
@*<form role="form">*@
<div class="masters" @*role="form"*@>
<table class="table table-responsive ">
@Html.HiddenFor(Model=>Model.PerTranCode)
<tr colspan="3" style="background-color:#f6ecb5">
<td>
Supplyer name
@Html.DropDownListFor(m => m.SupplyerId, new SelectList(Model.GetSupplyers, "SupplyerID", "Sypplyer_name"), "-- Select Customer --", new { @class = "form-control" })
</td>
<td> </td>
<td> </td>
<td>
Remanig ToPay balance @Html.DropDownListFor(m => m.ClosingBalance, new SelectList(" "), "0.00", new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.ClosingBalance, "", new { @class = "text-danger" })
</td>
<td> </td>
<td>
Gst Registration No @Html.DropDownListFor(m => m.Gst, new SelectList(" "), "0.00", new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.Gst, "", new { @class = "text-danger" })
</td>
</tr>
</table>
<table class=" pull-right">
<tr>
<td class="pull-right">
<div class="pull-right">
Invoice No : @Html.EditorFor(model => model.Invoice_no, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Invoice_no, "", new { @class = "text-danger" })
</div>
</td>
<td class="pull-right"><div class="pull-right"> </div></td>
<td class="pull-right">
<div class="pull-right">
Invoice Date @Html.EditorFor(model => model.InvoiceDate, new { htmlAttributes = new { @class = "form-control",@id= "InvoiceDate" } })
@Html.ValidationMessageFor(model => model.InvoiceDate, "", new { @class = "text-danger" })
</div>
</td>
</tr>
</table>
</div>
<div class="detail" @*role="form"*@>
<h4>Perches Items </h4>
<table class="table table-responsive table-bordered">
<tr>
<td style="color:#520d0d;background-color:antiquewhite;width:8%">Sr No</td>
<td style="color:#520d0d;background-color:antiquewhite">Product Name</td>
<td style="color:#520d0d;background-color:antiquewhite">Product GstCode</td>
<td style="color:#520d0d;background-color:antiquewhite ;width:14%"> Quantity</td>
<td style="color:#520d0d;background-color:antiquewhite ;width:16%"> Rate</td>
<td style="color:#520d0d;background-color:antiquewhite;width:14%"> Total </td>
<td style="color:#520d0d;background-color:antiquewhite"> CONTROLS </td>
</tr>
<tr ID="mainrow" class="mycontainer">
<td style="width:8%" id="sr">
@Html.EditorFor(model => model.Srno, new { htmlAttributes = new { @class = "sr form-control", @readonly = "readonly", @id = "Srno" } })
@Html.ValidationMessageFor(model => model.Srno, "", new { @class = "text-danger" })
<span class="error"> Entered Valide Qty </span>
</td>
<td>
@*<select id="ProductName",new SelectList(Model.product_s, "ProducID", "Product_Name"), class="pc form-control" >
<option>-Select-</option>
</select>*@
@Html.DropDownListFor(model => model.ProductId, new SelectList(Model.product_s, "ProducID", "Product_Name"), "--Select", new { @class = "pc form-control", @id = "ProdID" , @type = "Select" })
<span class="error"> Select Product </span>
</td>
<td id="gc">
@Html.DropDownListFor(model => model.ProductGstCode, new SelectList(" "), new { @class = "ProductGstCode form-control", @type = "Select" })
@Html.ValidationMessageFor(model => model.ProductGstCode, "", new { @class = "text-danger" })
<span class="error"> Select GstCode </span>
</td>
<td id="pq">
@Html.EditorFor(model => model.PerchesQty, new { htmlAttributes = new { @class = "PerchesQty form-control", @type = "number", } })
@Html.ValidationMessageFor(model => model.PerchesQty, "", new { @class = "text-danger" })
<span class="error"> Entered Valide Qty </span>
</td>
<td>
@Html.EditorFor(model => model.PerchesRate, new { htmlAttributes = new { @class = "PerchesRate form-control", @type = " number" } })
@Html.ValidationMessageFor(model => model.PerchesRate, "", new { @class = "text-danger" })
<span class="error"> Enter Valid Rate</span>
</td>
<td class="xtotGet">
@Html.EditorFor(model => model.Total, new { htmlAttributes = new { @class = "Total form-control", @readonly = "readonly", @id = "Total", @type = " number" } })
@*<input type="text" class="Total form-control" readonly="readonly" id="Total" style="width:90%" />*@
<span class="error"> Enter Valid Rate</span>
@* @Html.ValidationMessageFor(model => model.Total, "", new { @class = "text-danger" })*@
</td>
<td>
<input type="submit" id="add" value="add " style="width:65% " class="btn btn-success btn-sm" />
</td>
<td class="bt1" id="bt11">
<input type="submit" id="Edit" value="Edit " style="width:65% " class="btn1 btn-block" />
</td>
</tr>
</table>
</div>
<div id="orderItems" @*role="form"*@>
<table class="table table-responsive table-hover table-bordered" id="orderdetailsItems"></table>
<span id="orderItemsError" style="color:red"></span>
</div>
<div style="padding:10px ; text-align:right" class="pull-right" id="orderItems" role="form">
<input type="submit" name="Create" value="SAVE Perches" formaction=@Url.Action("NewPerches") formmethod="post" class="btn btn-warning pull-right" />
@* <input id="submit" type="button" value="Save Perches" class="btn btn-warning" style="padding:10px 20px" formaction=@Url.Action("NewPerches") formmethod="post" />*@
<input type="text" id="new " class="new1"/>
</div>
<div style="padding:10px ; text-align:right" class="pull-right" @*role="form"*@>
<table class="table table-responsive table-bordered">
<tr class="mtot">
<td>Net Total:</td>
<td style="text-align:right">
@Html.EditorFor(model => model.NetTotal, new { htmlAttributes = new { @class = "NTotal form-control", @readonly = "readonly",@id= "NetTotal" } })
@* <input type="text" class="tot form-control" readonly="readonly" id="NetTotal" style="width:82%" />*@
@Html.ValidationMessageFor(model => model.NetTotal, "", new { @class = "text-danger" })
</td>
</tr>
</table>
</div>
@*</form>*@
</div>
</body>
</html>
<link href="~/Content/bootstrap-theme.min.css" rel="stylesheet" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="~/Scripts/jquery-3.3.1.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script src="~/Scripts/perches.js"></script>
jquery (only for new row ading function )
$(document).ready(function () {
$("#add").click(function () {
$(".bt1").show();
var isAllValid = true;
if ($('#ProdID').val() == "0") {
isAllValid = false;
$('#ProdID').siblings('span.error').css('visibility', 'visible');
}
else {
$('#ProdID').siblings('span.error').css('visibility', 'hidden');
}
if ($('#ProductGstCode').val() == "") {
isAllValid = false;
$('#ProductGstCode').siblings('span.error').css('visibility', 'visible');
}
else {
$('#ProductGstCode').siblings('span.error').css('visibility', 'hidden');
}
if ($('#PerchesQty').val() == "0") {
isAllValid = false;
$('#PerchesQty').siblings('span.error').css('visibility', 'visible');
}
else {
$('#PerchesQty').siblings('span.error').css('visibility', 'hidden');
}
if ($('#PerchesRate').val() == "0.00") {
isAllValid = false;
$('#PerchesRate').siblings('span.error').css('visibility', 'visible');
}
else {
$('#PerchesRate').siblings('span.error').css('visibility', 'hidden');
}
if (isAllValid) {
var url = "/Perchus/UpdateUsersDetail";
var ProdID = $('#ProdID').val().trim();
var Gst = $('#Gst').val().trim();
var PerchesQty = $('#PerchesQty').val().trim();
var PerchesRate = $('#PerchesRate').val().trim();
var PerTranCode = $('#PerTranCode').val().trim();
var SupplyerId = $('#SupplyerId').val().trim();
var Srno = $('#Srno').val().trim();
debugger;
$.post(url, { ProdID: ProdID, Gst: Gst, PerchesQty: PerchesQty, PerchesRate: PerchesRate, PerTranCode: PerTranCode, SupplyerId: SupplyerId, Srno: Srno }, function (data) {
var _counter = 1;
var $newRow = $('#mainrow').clone(true).attr('id', 'nRow' + _counter);
$($newRow).attr('id', '$newRows' + _counter)
var xnr = $('#nRow').val();
if (xnr !== "") {
alert(xnr + " New ID");
}
$('.pc', $newRow).val($('#ProdID').val());
$('.product', $newRow).val($('#ProductGstCode').val());
$('.Total', $newRow).val($('#Total').val());
$('#add', $newRow).addClass('remove').val('Remove ').removeClass('btn-success').addClass('btn-danger');
$('#Edit'.$newRow).addClass('edit1').val('Edit ').removeClass('btn1 btn-block').addClass('btn btn-block');
$('#Srno,#ProdID,#ProductGstCode,#PerchesQty,#PerchesRate,#Total,#add,#Edit', $newRow).removeAttr('id');
var xsr = ("#Srno" + _counter);
$('#bt11', $newRow).removeClass('bt1');
$('span.error', $newRow).remove();
$('#orderdetailsItems').append($newRow);
$('#Total', $newRow).addClass('newtot' + _counter);
var ptot = $("#Total").val();
var Pnet = $("#NetTotal").val();
var n_result = "";
if (ptot !== "" && $.isNumeric(ptot) && $.isNumeric(Pnet)) {
n_result = parseFloat(ptot) + parseFloat(Pnet);
}
$("#NetTotal").append(n_result);
$("#NetTotal").val(n_result);
$('#ProdID,#ProductGstCode').val('0');
$('#PerchesQty,#PerchesRate,#Total').val('');
Srno++
$("#Srno").append(Srno);
$("#Srno").val(Srno);
$('#orderItemError').empty();
$(".bt1").hide();
alert($('#$newRows,#Total').html).val();
});
}
});
});