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

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

第二类如下

public string Name { get; set; }
public string Industry { get; set; }

我的控制器呈现视图

Person p = new Person()
{
     Name = "megan",Surname = "du Preez",Id = 0,Age = 22
 };
 return View(p);

在视图中

@model Models.Person

<form id="person">
    <div>
        @Html.TextBoxFor(mp => mp.Name)
        @Html.TextBoxFor(mp => mp.Surname)
        @(Html.Kendo().Grid<Models.Occupation>()
        .Name("Occupations")
        .Columns(columns =>
            {
                columns.Bound(e => e.Name);
                columns.Bound(e => e.Industry);
            })
        )
        .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("Occupations_Read","People",new { Name = Model.Name}))
        )
    </div>

    @Html.Kendo().Button().Name("btnTest").Content("Create")

这读取人员职业如下

List<Models.Occupation> oc = new List<Models.Occupation>();
oc.Add(new Models.Occupation() { CategoryName = "Lecturer" });
oc.Add(new Models.Occupation() { CategoryName = "Student" });
oc.Add(new Models.Occupation() { CategoryName = "Janitor" });

return Json(oc.ToDataSourceResult(request));

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

[HttpPost]
public JsonResult PersonPost(Models.Person p)
{
    //do stuff
}

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

$("#btnTest").click(function (e) {
    e.preventDefault();

    $.ajax({
        url: "/Tasks/PersonPost",type: 'POST',data: $('#person').serialize(),dataType: 'json',success: function (data) {

        }
    });
});

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

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

解决方法

试试这个..
@(Html.Kendo().Grid<Models.Occupation>()
    .Name("Occupations")
    .Columns(columns =>
     {
       columns.Bound(e => e.Name).ClientTemplate("#= Name #" +
        "<input type='hidden' name='Occupation[#= index(data)#].Name' value='#= Name #' />";
        columns.Bound(e => e.Industry).ClientTemplate("#= Industry #" +
        "<input type='hidden' name='Occupation[#= index(data)#].Industry' value='#= Industry#' />";
        })
    )
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("Occupations_Read",new { Name = Model.Name}))
    )

[HttpPost]
public JsonResult PersonPost(Models.Person p)
{
    //do stuff
}

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

//Index function for the WorkOrder Create view
        function index(dataItem) {

            var data = $("#GridName").data("kendoGrid").dataSource.data();
            return data.indexOf(dataItem);
        }

Shaz

猜你在找的JavaScript相关文章