The DevExtreme ASP.NET MVC Form can collect information from all hidden inputs and then post it to the Controller. The DataGrid does not initially have a hidden input, and the grid is placed into the form items template. If you assign model values to the grid's dataSource option, the model values are not passed to the server.
This example shows how to create hidden inputs for each DataGrid row at runtime and place the hidden inputs onto the form.
Specify the "name" attribute option of the hidden input element. Then, get grid data items from the clickHandler event. Save the data items to the input element in the CreateInputElement function.
<script>
function CreateInputElement(itemName, itemValue, itemIndex, container) {
var $input = $("<input/>");
$input.appendTo(container).attr({ type: "hidden", name: "Orders[" + itemIndex + "]." + itemName }).val(itemValue);
}
function clickHandler(e) {
if (e.validationGroup.validate().isValid) {
$("#grid").dxDataGrid("instance").getDataSource().load().done(function (items) {
for (var i = 0; i < items.length; i++) {
var item = items[i];
for (var property in item) {
if (item.hasOwnProperty(property)) {
CreateInputElement(property, item[property], i, $("#editEmployee")[0]);
}
}
}
$("#editEmployee").submit();
})
}
}
</script>