根据下拉更改绑定/重新绑定 Kendo Grid

Question

我有一个剑道网格，我需要根据不在网格中的下拉列表的值在初始页面加载时绑定它。我需要根据该下拉列表中的用户选择重新绑定网格。我很接近，但我不知道该怎么做，也找不到一个例子。我不确定我需要在我需要为下拉列表编写的 onchange 事件中添加什么（它当前是一个空字符串，这当然是错误的）。

欢迎任何帮助！

这是标记：

        <div class="editor-label">
        @Html.Label("Storeroom List")
    </div>
    <div class="editor-field">
        @Html.DropDownList("StoreroomID", new SelectList(ViewBag.storeroomNames, "RoomID", "RoomID"), "-- Select Storeroom --", new { @onchange = "" })
    </div>
<br />

@(Html.Kendo().Grid(Model)
.Name("BatchGrid")
.Pageable()
.Sortable()
.Scrollable()
.HtmlAttributes(new { style = "height:675px; width:1200px" })
.Columns(columns =>
            {
                columns.Bound(b => b.BatchID)
                                    .Width("300px")
                                    .Title("Batch ID");
                columns.Bound(b => b.HasErrorTransaction)
                                    .Width("50px")
                                    .Title("Err");
                columns.Command(c => c.Custom("Post Batch").Click("onClickPostBatch").HtmlAttributes(new { style = "width:100px;" }));
                columns.Bound(b => b.Created_Emp_Name)
                                    .Width("200px")
                                    .Title("Created Employee");
                columns.Bound(b => b.Transmitted_DateTime)
                                    .Width("175px")
                                    .Format("{0:MM/dd/yyyy hh:mm tt}")
                                    .Title("Transmitted");
                columns.Bound(b => b.Completed_DateTime)
                                    .Width("175px")
                                    .Format("{0:MM/dd/yyyy hh:mm tt}")
                                    .Title("Completed");
                columns.Command(c => c.Custom("Delete Batch").Click("onClickDeleteBatch").HtmlAttributes(new { style = "width:100px;" }));
            }
        )
    .DataSource(dataSource => dataSource
        .Ajax()
        .Sort(sort => sort.Add("HasErrorTransaction").Ascending()) // <-- initial sort
        .PageSize(40)
        .Read(read => read.Action("FetchBatchCollection", "Home").Data("addlDataStoreroom"))
        .ServerOperation(false)
    )
    .ClientDetailTemplateId("transactions")
    //.Events(events => events.DataBound("dataBound"))
)

这是我用于网格的附加数据子句的 javascript

    function addlDataStoreroom() {
    var selsectedStoreRoomId = $("#StoreRoomID").val();
    if (selsectedStoreRoomId == '-- Select Storeroom --')
        selsectedStoreRoomId = null;

    return { storeroomId: selsectedStoreRoomId };
}

Answer 1

在Reloading/refreshing Kendo Grid 找到了我正在寻找的答案（必须正确地提出问题！）。在这里说明一下，答案如下（为了清楚起见，我显示了完整的代码：

当从下拉列表中选择一个值时，将调用 refreshGrid 方法，该方法又调用在网格的 Read 属性上定义的 addlDataStoreroom。然后 refreshGrid 的第二行使网格调用控制器代码并重新绑定到结果数据集。

这是javascript：

    function addlDataStoreroom() {
    var selsectedStoreRoomId = $("#StoreroomID").val();
    if (selsectedStoreRoomId == '-- Select Storeroom --')
        selsectedStoreRoomId = null;

    return { storeroomId: selsectedStoreRoomId };
}

function refreshGrid()
{
    $("#BatchGrid").data('kendoGrid').dataSource.read();
    $("#BatchGrid").data('kendoGrid').refresh();
}

这是标记：

        <div class="editor-label">
        @Html.Label("Storeroom List")
    </div>
    <div class="editor-field">
        @Html.DropDownList("StoreroomID", new SelectList(ViewBag.storeroomNames, "RoomID", "RoomID"), "-- Select Storeroom --", new { onchange = "refreshGrid();" })
    </div>
<br />

@(Html.Kendo().Grid(Model)
.Name("BatchGrid")
.Pageable()
.Sortable()
.Scrollable()
.HtmlAttributes(new { style = "height:675px; width:1200px" })
.Columns(columns =>
            {
                columns.Bound(b => b.BatchID)
                                    .Width("300px")
                                    .Title("Batch ID");
                columns.Bound(b => b.HasErrorTransaction)
                                    .Width("50px")
                                    .Title("Err");
                columns.Command(c => c.Custom("Post Batch").Click("onClickPostBatch").HtmlAttributes(new { style = "width:100px;" }));
                columns.Bound(b => b.Created_Emp_Name)
                                    .Width("200px")
                                    .Title("Created Employee");
                columns.Bound(b => b.Transmitted_DateTime)
                                    .Width("175px")
                                    .Format("{0:MM/dd/yyyy hh:mm tt}")
                                    .Title("Transmitted");
                columns.Bound(b => b.Completed_DateTime)
                                    .Width("175px")
                                    .Format("{0:MM/dd/yyyy hh:mm tt}")
                                    .Title("Completed");
                columns.Command(c => c.Custom("Delete Batch").Click("onClickDeleteBatch").HtmlAttributes(new { style = "width:100px;" }));
            }
        )
    .DataSource(dataSource => dataSource
        .Ajax()
        .Sort(sort => sort.Add("HasErrorTransaction").Ascending()) // <-- initial sort
        .PageSize(40)
        .Read(read => read.Action("FetchBatchCollection", "Home").Data("addlDataStoreroom"))
        .ServerOperation(false)
    )
    .ClientDetailTemplateId("transactions")
    //.Events(events => events.DataBound("dataBound"))
)