Question

我正在使用一个填充了一些数据的kendoui Grid。网格有一个模板列，复选框和其他一些带有客户端模板的列，其中包含一个文本框。

我现在需要将使用复选框选择的行数据传递给控制器操作。

应将文本框中的更新值传递给控制器。

如果有人有相同的解决方案，请告诉我。

这是网格

@(Html.Kendo().Grid<MMM.Lumos.Entities.CustomEntities.TestPlanTestPointMappingViewModel>()
                        .Name("ATPGrid")
                        .Columns(columns =>
                        {
                            columns.Bound(p => p.IsSelected).ClientTemplate("<input type='checkbox' value='#= IsSelected #' " + "# if (IsSelected) { #" + "checked='checked'" + "# } #" + "/>").Width(40);
                            columns.Bound(p => p.TestPointName).Filterable(false).Width(60);
                            columns.Bound(p => p.PassThreshold).ClientTemplate(Html.Kendo().IntegerTextBox().Name("mp_#=TestPointId#").Min(0).HtmlAttributes(new { value = "#=PassThreshold#", style = "width: 50px;" }).ToClientTemplate().ToHtmlString()).Width(60);
                            columns.Bound(p => p.FailThreshold).ClientTemplate(Html.Kendo().IntegerTextBox().Name("mp_#=TestPointId#").Min(0).HtmlAttributes(new { value = "#=FailThreshold#", style = "width: 50px;" }).ToClientTemplate().ToHtmlString()).Width(60);

                        })
                        .Scrollable()
        //.HtmlAttributes(new { style = "height:430px;" })
                        .DataSource(dataSource => dataSource
                            .Ajax()
                            .PageSize(20)
                            .Read(read => read.Action("ATPGrid_Read", "TestPlan"))
                         )
                    )

我有一个提交按钮

<input type="submit" name="Add" formmethod="post" onclick="PostData()" value="Add" />

Javascript功能

<script>
    function PostData() {        
        var griddata = $("#ATPGrid").data("kendoGrid");

        alert(JSON.stringify({ griditems: griddata.dataSource.view() }));

        //$.ajax(
        //       {
        //           type: 'POST',
        //           url: '/configuration/testplan/Add',
        //           dataType: 'json',
        //           contentType: "application/json; charset=utf-8",
        //           data: JSON.stringify({ griditems: griddata.dataSource.view() }),
        //           success: function (result) {
        //               alert('success');
        //           }
        //       });
    }

</script>

我需要点击添加按钮获取此网格的值。如您所见，我在网格中有一个客户端模板列，复选框和文本框。

我需要从这个文本框中获取值并将其传递给控制器。

如果只有那些使用复选框选择的那些应该传递给控制器，那就太好了。

Answer 1

我不确定在Kendo UI Grid中是否有简单的方法将值从View传递到Controller。但我在第三方MVC网格中遵循以下方式传递复选框值。您可以将此功能绑定到按钮单击事件。简单操作可能太长。可能对您有用，您可以根据自己的需要进行优化。

function PostData(sender, args) {
        var tempCheckedRecords = new Array();
        var gridobj = $find("Grid1"); // getting Grid object. Modify it for KendoUI grid.
        if (sender.checked == true) {
            ... //retrieve the records here
            tempCheckedRecords.push(records[0]); // pass the selected records in the array 

        }

        var tempRecords = new Array();
        $.each(tempCheckedRecords, function (index, element) {
            var record = {};
            record["Column0"] = element.IsSelected; // column names in Grid
            record["Column1"] = element.TestPointName; // you can get the text box values in the element.
            record["Column2"] = element.PassThreshold;
            tempRecords.push(record);

        });

        var params = {};
        var visibleColumns = gridobj.get_VisibleColumnName();
        $.each(tempRecords, function (i, record) {
            $.each(visibleColumns, function (j, value) {
                params["Test[" + i + "]." + this] = record[value];
            });
        });

        $.ajax({
            type: 'post',
            url: "/configuration/testplan/Add",
            datatype: 'json',
            data: params,
            success: function (data) {
                return data;
            }
        });



    }

Answer 2

探索在Kendo Grid中添加AJAX更新调用：

.Datasource(datasource => datasource.Ajax
    .Read(read => read.Action(...))
    .Update(update => update.Update("UpdateAction", "Controller))

然后在你的控制器中添加一个动作：

public ActionResult UpdateAction(IEnumerable<NewsModel> model)
{
    //...do stuff
}

MVC |剑道网格|将数据从View传递给控制器

2 个答案: