Question

我有一个Kendo网格，我需要根据不在网格中的下拉列表的值绑定初始页面加载。我需要根据该下拉列表中的用户选择重新绑定网格。我很接近，但我无法弄清楚如何去做，也找不到一个例子。我不确定我需要在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"))
)

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

1 个答案: