Как передать данные из представления в контроллер по ajax запросу в качестве входных параметров в метод действия контроллера
Проблема
невозможно передать данные из представления в контроллер по ajax запросу в качестве входных параметров в метод действия контроллера
У меня есть имя модели класса SalesHeader следующим образом
public class SalesHeader
{
public int SalesOrderNo { get; set; }
public int SalesYear { get; set; }
public int CustomerID { get; set; }
public Customer Customers { get; set; }
public ICollection<SalesFooter> SalesFooters { get; set; }
}
Я делаю контроллер SalesOrder на основе модели SalesHeader
в контроллере salesorder у меня есть actionresult Create
Мне нужно передать данные из представления результата действия create в метод Controller salesorder Create в качестве входных параметров
[HttpPost]
public ActionResult Create(SalesHeader sh, SalesFooter[] orderItems)
{
}
заголовок продаж представлен sh as ( SalesOrderNo,SalesYear,CustomerId )
получила футер представлен SalesFooter ш а ( SalesLineNo,артикул,кол-во,цена,Итого )
а SalesFooter[] orderItems представляют собой публичную коллекцию ICollection<salesfooter> SalesFooters { get; set; }
и я буду получать данные элементов из представления в контроллер в виде массива элементов
Дизайн формы
on Header(represent by Sales Header Model) SalesOrderNO 1 SalesYear 2019 CustomerNo 2509 on Footer(represent by Sales Footer Model) SalesLineNo ItemCode Quantity Price Total 1 12929 5 10 50 2 17918 4 5 20
так что я поставлю точку останова на методе create и когда нажму кнопку save
должно быть, одну запись на коллекторе продаж(ш) и два рекорда по продажам нижний колонтитул ( строк orderitems)
так что мой главный вопрос как передать эти записи из вида в контроллер
Я работаю дальше asp.net ядро 2.1 visual studio 2017 sql server 2012
после Нажмите кнопку Сохранить, я делаю проверку я нашел две записи уже отправлены, но на регулятор не существовать по продажам заголовка или footet параметры создания
Что я уже пробовал:
my view as following
@model TabDataAccess.Dto.SalesHeader
<script>
$(document).ready(function () {
var orderItems = [];
//Add button click function
$('#add').click(function () {
//Check validation of order item
var isValidItem = true;
//Add item to list if valid
if (isValidItem) {
orderItems.push({
SalesLineNo: $('#SalesLineNo').val().trim(),
ItemCode: $('#ItemCode').val().trim(),
Quantity: parseInt($('#Qunatity').val().trim()),
UnitPrice: parseFloat($('#UnitPrice').val().trim()),
Total: parseInt($('#Qunatity').val().trim()) * parseFloat($('#UnitPrice').val().trim())
});
////Clear fields
$('#SalesLineNo').val('').focus();
$('#ItemCode','#Qunatity,#UnitPrice').val('');
}
//populate order items
GeneratedItemsTable();
});
function GeneratedItemsTable() {
if (orderItems.length > 0) {
var $table = $('<table/>');
$table.append('<thead><tr><th>SalesLineNo</th><th>ItemCode</th><th>Qunatity</th><th>UnitPrice</th><th>Total</th><th></th></tr></thead>');
var $tbody = $('<tbody/>');
$.each(orderItems, function (i, val) {
var $row = $('<tr/>');
$row.append($('<td/>').html(val.SalesLineNo));
$row.append($('<td/>').html(val.ItemCode));
$row.append($('<td/>').html(val.Qunatity));
$row.append($('<td/>').html(val.UnitPrice));
$row.append($('<td/>').html(val.Total));
var $remove = $('<a href="#">Remove</a>');
$remove.click(function (e) {
e.preventDefault();
orderItems.splice(i, 1);
GeneratedItemsTable();
});
$row.append($('<td/>').html($remove));
$tbody.append($row);
});
console.log("current", orderItems);
$table.append($tbody);
$('#orderItems').html($table);
}
else {
$('#orderItems').html('');
}
}
$("#saveOrder").click(function (e) {
e.preventDefault();
var orderItems = [];
orderItems.length = 0;
orderItems.push({
SalesLineNo: $('#SalesLineNo').val().trim(),
ItemCode: $('#ItemCode').val().trim(),
Quantity: parseInt($('#Qunatity').val().trim()),
UnitPrice: parseFloat($('#UnitPrice').val().trim()),
Total: parseInt($('#Qunatity').val().trim()) * parseFloat($('#UnitPrice').val().trim())
});
var data = JSON.stringify({
orderfooter: orderItems
});
$.ajax({
contentType: 'application/json; charset=utf-8',
dataType: 'json',
type: 'POST',
url: '/SalesOrder/Create',
data: orderItems,
success: function (result) {
alert(result);
location.reload();
},
error: function () {
alert("Error!")
}
});
});
});
</script>
<h2>Create</h2>
<h4>SalesHeader</h4>
<hr />
<div class="row">
<div class="col-md-4">
<form asp-action="Create">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
<label asp-for="SalesOrderNo" class="control-label"></label>
<input asp-for="SalesOrderNo" class="form-control" />
<span asp-validation-for="SalesOrderNo" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="SalesYear" class="control-label"></label>
<input asp-for="SalesYear" class="form-control" />
<span asp-validation-for="SalesYear" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="CustomerID" class="control-label"></label>
@*<select asp-for="CustomerID" class="form-control" asp-items="ViewBag.CustomerID"></select>*@
<input asp-for="CustomerID" class="form-control" />
<span asp-validation-for="CustomerID" class="text-danger"></span>
</div>
<div class="details">
<h4>Order Items</h4>
<table width="100%">
<tr>
<td>SalesLineNo</td>
<td>ItemCode</td>
<td>Quantity</td>
<td>UnitPrice</td>
<td>Total</td>
<td> </td>
</tr>
<tr>
<td>
<input type="text" id="SalesLineNo" />
<span class="error">Item name required</span>
</td>
<td>
<input type="text" id="ItemCode" />
<span class="error">Valid quantity required</span>
</td>
<td>
<input type="text" id="Qunatity" />
<span class="error">Valid rate required</span>
</td>
<td>
<input type="text" id="UnitPrice" />
<span class="error">Valid rate required</span>
</td>
<td>
<input type="text" id="Total" />
<span class="error">Valid rate required</span>
</td>
<td>
<input type="button" id="add" value="add" />
</td>
</tr>
</table>
<div id="orderItems" class="tablecontainer">
</div>
@*<div style="padding:10px 0px; text-align:right">
<input id="submit" type="button" value="Save" style="padding:10px 20px" />
</div>*@
<div class="form-group">
@*<input type="submit" value="Create" class="btn btn-default" />*@
<button id="saveOrder" type="submit"value="Create" class="btn btn-default">Save Order</button>
</div>
</div>
</form>
</div>
</div>