javascript – 在MVC中将Kendo Grid数据发布到Controller

前端之家收集整理的这篇文章主要介绍了javascript – 在MVC中将Kendo Grid数据发布到Controller前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有两节课.一个包含其他类的列表:
  1. public string Name { get; set; }
  2. public string Surname { get; set; }
  3. public int Age { get; set; }
  4. public List<Models.Occupation> Occupations { get; set; }

第二类如下

  1. public string Name { get; set; }
  2. public string Industry { get; set; }

我的控制器呈现视图

  1. Person p = new Person()
  2. {
  3. Name = "megan",Surname = "du Preez",Id = 0,Age = 22
  4. };
  5. return View(p);

在视图中

  1. @model Models.Person
  2.  
  3. <form id="person">
  4. <div>
  5. @Html.TextBoxFor(mp => mp.Name)
  6. @Html.TextBoxFor(mp => mp.Surname)
  7. @(Html.Kendo().Grid<Models.Occupation>()
  8. .Name("Occupations")
  9. .Columns(columns =>
  10. {
  11. columns.Bound(e => e.Name);
  12. columns.Bound(e => e.Industry);
  13. })
  14. )
  15. .DataSource(dataSource => dataSource
  16. .Ajax()
  17. .Read(read => read.Action("Occupations_Read","People",new { Name = Model.Name}))
  18. )
  19. </div>
  20.  
  21. @Html.Kendo().Button().Name("btnTest").Content("Create")

这读取人员职业如下

  1. List<Models.Occupation> oc = new List<Models.Occupation>();
  2. oc.Add(new Models.Occupation() { CategoryName = "Lecturer" });
  3. oc.Add(new Models.Occupation() { CategoryName = "Student" });
  4. oc.Add(new Models.Occupation() { CategoryName = "Janitor" });
  5.  
  6. return Json(oc.ToDataSourceResult(request));

所有这些都呈现了我的观点,一切正常,但在表单帖子上我想将所有内容发送回动作

  1. [HttpPost]
  2. public JsonResult PersonPost(Models.Person p)
  3. {
  4. //do stuff
  5. }

我可以使用以下javascript轻松发布Person的名字和Surname

  1. $("#btnTest").click(function (e) {
  2. e.preventDefault();
  3.  
  4. $.ajax({
  5. url: "/Tasks/PersonPost",type: 'POST',data: $('#person').serialize(),dataType: 'json',success: function (data) {
  6.  
  7. }
  8. });
  9. });

但网格中的职业不会被序列化并回发到控制器操作.

我的问题是如何将整个模型与视图中的职业列表发布到控制器.

解决方法

试试这个..
  1. @(Html.Kendo().Grid<Models.Occupation>()
  2. .Name("Occupations")
  3. .Columns(columns =>
  4. {
  5. columns.Bound(e => e.Name).ClientTemplate("#= Name #" +
  6. "<input type='hidden' name='Occupation[#= index(data)#].Name' value='#= Name #' />";
  7. columns.Bound(e => e.Industry).ClientTemplate("#= Industry #" +
  8. "<input type='hidden' name='Occupation[#= index(data)#].Industry' value='#= Industry#' />";
  9. })
  10. )
  11. .DataSource(dataSource => dataSource
  12. .Ajax()
  13. .Read(read => read.Action("Occupations_Read",new { Name = Model.Name}))
  14. )
  15.  
  16. [HttpPost]
  17. public JsonResult PersonPost(Models.Person p)
  18. {
  19. //do stuff
  20. }

你应该能够在Person中获得价值.
添加以下功能..
************** **************的Javascript

  1. //Index function for the WorkOrder Create view
  2. function index(dataItem) {
  3.  
  4. var data = $("#GridName").data("kendoGrid").dataSource.data();
  5. return data.indexOf(dataItem);
  6. }

Shaz

猜你在找的JavaScript相关文章