How Send Multiple Rows by using multiple models in ASP.NET MVC - asp.net-mvc

Question

public partial class Sale
{
public int Sale_id { get; set; }
public string Order_No { get; set; }
public string Customer_name { get; set; }
public string Customer_phone { get; set; }
public string Customer_address { get; set; }
public string Payment_method { get; set; }
public double Total_amout { get; set; }
public bool Status_bit { get; set; }
public string Created_by { get; set; }
public System.DateTime Created_date { get; set; }
public string Modified_by { get; set; }
public System.DateTime Modified_date { get; set; }
}
public partial class SalesDetail
{
public int Sales_detail_id { get; set; }
public string Order_No_cp { get; set; }
public int Product_id { get; set; }
public double Unit_price { get; set; }
public int Quantity { get; set; }
public double LineTotal { get; set; }
public virtual Product Product { get; set; }
}
I Combined two model (Sales & SalesDetail)
public class Combined
{
public virtual Sale MCombined_Sales { get; set; }
public virtual SalesDetail MCombined_SalesDetail { get; set; }
}
Controller
public ActionResult Client()
{
Session["SysDateTime"] = System.DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
Session["CrruntUser"] = "Testing";
ViewBag.Product_id = new SelectList(db.Products, "Product_id", "Product_name");
return View();
}
[HttpPost]
public ActionResult Add(Combined model)
{
if (ModelState.IsValid == true)
{
var MCombined_Sales = new Sale
{
Order_No = model.MCombined_Sales.Order_No,
Customer_name = model.MCombined_Sales.Customer_name,
Customer_phone = model.MCombined_Sales.Customer_phone,
Customer_address = model.MCombined_Sales.Customer_address,
Payment_method = model.MCombined_Sales.Payment_method,
Total_amout = model.MCombined_Sales.Total_amout,
Status_bit = model.MCombined_Sales.Status_bit,
Created_by = model.MCombined_Sales.Created_by,
Created_date = model.MCombined_Sales.Created_date,
Modified_by = model.MCombined_Sales.Modified_by,
Modified_date = model.MCombined_Sales.Modified_date,
};
var MCombined_SalesDetail = new SalesDetail
{
Order_No_cp = model.MCombined_SalesDetail.Order_No_cp,
Product_id = model.MCombined_SalesDetail.Product_id,
Unit_price = model.MCombined_SalesDetail.Unit_price,
Quantity = model.MCombined_SalesDetail.Quantity,
LineTotal = model.MCombined_SalesDetail.LineTotal,
};
using (var context = new Entities())
{
context.Sales.Add(MCombined_Sales);
MCombined_Sales.Sale_id = MCombined_Sales.Sale_id;
context.SalesDetails.Add(MCombined_SalesDetail);
context.SaveChanges();
ModelState.Clear();
}
}
return View();
}
View ( With using namespace:- #model ASH_POS.Models.Merge.Combined)
#using (Html.BeginForm(new { #id = "registerFormId", #class = "form-horizontal", role = "form" })) {
#Html.AntiForgeryToken()
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="card">
<h4 class="text-center">Sale</h4>
<div id="Detail" class="row visually-hidden">
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Status_bit, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
<div class="checkbox">
#Html.EditorFor(model => model.MCombined_Sales.Status_bit)
#Html.ValidationMessageFor(model => model.MCombined_Sales.Status_bit, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Created_by, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Created_by, new { htmlAttributes = new { #class = "form-control", #Value = Session["CrruntUser"], #readonly = "readonly" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Created_by, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Created_date, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Created_date, new { htmlAttributes = new { #class = "form-control", #Value = Session["SysDateTime"], #readonly = "readonly" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Created_date, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Modified_by, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Modified_by, new { htmlAttributes = new { #class = "form-control", #Value = Session["CrruntUser"], #readonly = "readonly" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Modified_by, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Modified_date, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Modified_date, new { htmlAttributes = new { #class = "form-control", #Value = Session["SysDateTime"], #readonly = "readonly" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Modified_date, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
<div class="card-title">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Order_No, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Order_No, new { htmlAttributes = new { #class = "form-control", #required = true, #Value = "1500" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Order_No, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="card-body">
<div class="row">
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Customer_name, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Customer_name, new { htmlAttributes = new { #class = "form-control", #required = true, #Value = "N/A" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Customer_name, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Customer_phone, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Customer_phone, new { htmlAttributes = new { #class = "form-control", #Value = "N/A" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Customer_phone, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Customer_address, htmlAttributes: new { #class = "control-label" })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Customer_address, new { htmlAttributes = new { #class = "form-control", #Value = "N/A" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Customer_address, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Payment_method, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Payment_method, new { htmlAttributes = new { #class = "form-control", #Value = "Cash" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Payment_method, "", new { #class = "text-danger" })
</div>
</div>
</div>
<div class="col">
<div class="form-group">
#Html.LabelFor(model => model.MCombined_Sales.Total_amout, htmlAttributes: new { #class = "control-label " })
<div class="col-md-10">
#Html.EditorFor(model => model.MCombined_Sales.Total_amout, new { htmlAttributes = new { #class = "form-control", #readonly = "readonly" } })
#Html.ValidationMessageFor(model => model.MCombined_Sales.Total_amout, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
</div>
<div class="card-footer">
<table id="tblProduct" class="table" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>Order No</th>
<th>Product Name</th>
<th>Per Pice Price</th>
<th>Quantity</th>
<th>Amount</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" readonly value="" placeholder="Enter Order No " id="textBox_Order_No_cp" class="form-control" /></td>
<td><input type="text" value="1" placeholder="Search Product " id="textBox_Product_id" class="form-control" /></td>
<td><input type="number" value="15" min="0" placeholder="Enter Unit Price Product " id="textBox_Unit_price" class="form-control" /></td>
<td><input type="number" value="" step="1" min="1" placeholder="Enter Quantity" id="textBox_Quantity" class="form-control" /></td>
<td><input type="number" min="1" readonly value="" placeholder="Line Total" id="textBox_LineTotal" class="form-control" /></td>
<td><input type="button" id="btnAddProduct" value="Add" class="btn btn-sm" /></td>
</tr>
</tbody>
<tfoot>
<tr>
<td>
#Html.EditorFor(model => model.MCombined_SalesDetail.Order_No_cp, new { htmlAttributes = new { #class = "form-control", #placeholder = "Order Number" } })
#Html.ValidationMessageFor(model => model.MCombined_SalesDetail.Order_No_cp, "", new { #class = "text-danger" })
</td>
<td>
#Html.EditorFor(model => model.MCombined_SalesDetail.Product_id, new { htmlAttributes = new { #class = "form-control", #placeholder = "ID" } })
#Html.ValidationMessageFor(model => model.MCombined_SalesDetail.Product_id, "", new { #class = "text-danger" })
</td>
<td>
#Html.EditorFor(model => model.MCombined_SalesDetail.Unit_price, new { htmlAttributes = new { #class = "form-control", #placeholder = "Unit Price", #min = "0" } })
#Html.ValidationMessageFor(model => model.MCombined_SalesDetail.Unit_price, "", new { #class = "text-danger" })
</td>
<td>
#Html.EditorFor(model => model.MCombined_SalesDetail.Quantity, new { htmlAttributes = new { #class = "form-control", #placeholder = "Quantity", #type = "number", #min = "1" } })
#Html.ValidationMessageFor(model => model.MCombined_SalesDetail.Quantity, "", new { #class = "text-danger" })
</td>
<td>
#Html.EditorFor(model => model.MCombined_SalesDetail.LineTotal, new { htmlAttributes = new { #class = "form-control", #placeholder = "LineTotal", } })
#Html.ValidationMessageFor(model => model.MCombined_SalesDetail.LineTotal, "", new { #class = "text-danger" })
</td>
<td></td>
</tr>
</tfoot>
</table>
</div>
<div id="btns">
<div class="form-group dataTables_wrapper">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn " id="AddClient" />
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="reset" value="Reset" class="btn" id="AddClient" />
</div>
</div>
<input type="submit" value="Testing Multi Row Table" class="btn btn-info close" id="btnTesting" />
</div>
</div> }
Use jQuery For Handle Multiple Models
$("#AddClient").click(function () {
var MCombined_Sales = {
Order_No: $('##Html.IdFor(model => model.MCombined_Sales.Order_No)').val(),
Customer_name: $('##Html.IdFor(model => model.MCombined_Sales.Customer_name)').val(),
Customer_phone: $('##Html.IdFor(model => model.MCombined_Sales.Customer_phone)').val(),
Customer_address: $('##Html.IdFor(model => model.MCombined_Sales.Customer_address)').val(),
Payment_method: $('##Html.IdFor(model => model.MCombined_Sales.Payment_method)').val(),
Total_amout: $('##Html.IdFor(model => model.MCombined_Sales.Total_amout)').val(),
Status_bit: $('##Html.IdFor(model => model.MCombined_Sales.Status_bit)').val(),
Created_by: $('##Html.IdFor(model => model.MCombined_Sales.Created_by)').val(),
Created_date: $('##Html.IdFor(model => model.MCombined_Sales.Created_date)').val(),
Modified_by: $('##Html.IdFor(model => model.MCombined_Sales.Modified_by)').val(),
Modified_date: $('##Html.IdFor(model => model.MCombined_Sales.Modified_date)').val()
};
var MCombined_SalesDetail = {
Order_No_cp: $('##Html.IdFor(model => model.MCombined_SalesDetail.Order_No_cp)').val(),
Product_id: $('##Html.IdFor(model => model.MCombined_SalesDetail.Product_id)').val(),
Unit_price: $('##Html.IdFor(model => model.MCombined_SalesDetail.Unit_price)').val(),
Quantity: $('##Html.IdFor(model => model.MCombined_SalesDetail.Quantity)').val(),
LineTotal: $('##Html.IdFor(model => model.MCombined_SalesDetail.LineTotal)').val()
};
var model = {
"MCombined_Sales": MCombined_Sales,
"MCombined_SalesDetail": MCombined_SalesDetail
}
$.ajax({
type: "POST",
url: "/Customer/Add",
data: model,
dataType: "json",
success: function (r) {
alert("id: " + r.Sale_id.toString());
},
failure: function (response) {
alert(response.responseText);
},
error: function (response) {
alert(response.responseText);
}
});
});
I try use jQuery For Send Multiple Rows to db butt no success
$("body").on("click", "#btnAddProduct", function () {
//Reference the Name and Country TextBoxes.
var textBox_Order_No_cp = $("#textBox_Order_No_cp");
var textBox_Product_id = $("#textBox_Product_id");
var textBox_Unit_price = $("#textBox_Unit_price");
var textBox_Quantity = $("#textBox_Quantity");
var textBox_LineTotal = $("#textBox_LineTotal");
//Get the reference of the Table's TBODY element.
var tBody = $("#tblProduct > TBODY")[0];
//Add Row.
var row = tBody.insertRow(-1);
//Add textBox_Order_No_cp cells.
var cell = $(row.insertCell(-1));
cell.html(textBox_Order_No_cp.val());
//Add textBox_Product_id cell.
var cell = $(row.insertCell(-1));
cell.html(textBox_Product_id.val());
//Add textBox_Unit_price cell.
var cell = $(row.insertCell(-1));
cell.html(textBox_Unit_price.val());
//Add textBox_Quantity cell.
var cell = $(row.insertCell(-1));
cell.html(textBox_Quantity.val());
//Add textBox_LineTotal cell.
var cell = $(row.insertCell(-1));
cell.html(textBox_LineTotal.val());
//Add Button cell.
cell = $(row.insertCell(-1));
var btnRemove = $("<input />");
btnRemove.attr("type", "button");
btnRemove.attr("onclick", "Remove(this);");
btnRemove.addClass("btn btn-sm btn_row_remove")
btnRemove.val("x");
cell.append(btnRemove);
//Clear the TextBoxes.
//textBox_Order_No_cp.val("");
textBox_Product_id.val("");
textBox_Unit_price.val("");
textBox_Quantity.val("");
textBox_LineTotal.val("");
$('#btnAddProduct').attr("disabled", true);
});
function Remove(button) {
//Determine the reference of the Row using the Button.
var row = $(button).closest("TR");
var name = $("TD", row).eq(1).html();
//if (confirm("Do you want to delete: " + name)) {
// //Get the reference of the Table.
// var table = $("#tblProduct")[0];
// //Delete the Table row using it's Index.
// table.deleteRow(row[0].rowIndex);
//}
// if dirict delete with out msg
var table = $("#tblProduct")[0];
table.deleteRow(row[0].rowIndex);
};
$("body").on("click", "#btnTesting", function () {
//Loop through the Table rows and build a JSON array.
var DataMethod = new Array();
$("#tblProduct TBODY TR").each(function () {
var row = $(this);
var DataString = {};
DataString.MCombined_SalesDetail.Order_No_cp = row.find("TD").eq(0).html();
DataString.MCombined_SalesDetail.Product_id = row.find("TD").eq(1).html();
DataString.MCombined_SalesDetail.Unit_price = row.find("TD").eq(2).html();
DataString.MCombined_SalesDetail.Quantity = row.find("TD").eq(3).html();
DataString.MCombined_SalesDetail.LineTotal = row.find("TD").eq(4).html();
DataMethod.push(DataString);
alert("Check Array");
});
alert("Going To Ajax");
//Send the JSON array to Controller using AJAX.
$.ajax({
type: "POST",
url: "/Customer/Insert",
data: JSON.stringify(DataMethod),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
alert(r + " record(s) inserted.");
}
});
});
I have sent multiple models data to database successfully, but i face problems send multiple row data.