Отправка данных формы через ajax в контроллер с использованием сетки пользовательского интерфейса Kendo

Question

Я пытаюсь отправить данные модели из формы в контроллер через сетку kendo ui. Я еще не нашел никакой помощи в этом.

1. Могу ли я просто выполнить сериализацию данных формы и отправить ее в качестве параметра?

Вот мой код сетки,

enter@(Html.Kendo().Grid<LookupGridResults>() 
           .Name("grid") 

           .Columns(columns => 
           { 
            columns.Bound(p => p.FirstName).Width(225); 
            columns.Bound(p => p.LastName).Width(225); 
            columns.Bound(p => p.City).Width(225); 
            columns.Bound(p => p.County).Width(225); 
            columns.Bound(p => p.State).Width(225); 
            columns.Bound(p => p.Zip).Width(225); 
           }) 
           .Pageable() 
           .Sortable() 
           .Scrollable() 
           .HtmlAttributes(new { style = "height:550px;" }) 
           .DataSource(dataSource => dataSource 
            .Ajax() 
            .PageSize(50) 
            .ServerOperation(true) 
            .Read(read => read.Action("ReadLeads", "LeadsManagement")) 

           ) 

            ) 

Я хочу, чтобы попытаться сделать это как AjX вызов к контроллеру, если это возможно.

Answer 1

Вы можете использовать grid.dataSource.read метод с параметром объекта данных (http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-read):

var optionalData = { foo: 42, bar: "baz" }; 
dataSource.read(optionalData); 

Или, если вы хотите запрос пользовательских действий, то есть недокументированные dataSource.success метод:

$.ajax({ 
    type: "POST", 
    url: '...', 
    data: {....}, 
    success: function (data) { 
     //data is array of grid items to rebind 
     grid.dataSource.success(data); 
    } 
}); 

Update

Чтобы собрать данные из формы, я использую расширение jquery serializeObject (https://stackoverflow.com/a/1186309/5575536):

$.fn.serializeObject = function() 
{ 
    var o = {}; 
    var a = this.serializeArray(); 
    $.each(a, function() { 
     if (o[this.name] !== undefined) { 
      if (!o[this.name].push) { 
       o[this.name] = [o[this.name]]; 
      } 
      o[this.name].push(this.value || ''); 
     } else { 
      o[this.name] = this.value || ''; 
     } 
    }); 
    return o; 
}; 

А использование в следующем:

var data = $('#form').serializeObject(); 
//or 
var data = $('#container').find('input,select,textarea').serializeObject();