Question

我有3个局部视图的视图。第一个局部视图有一个Kendo网格，当你在网格中选择一行时，它会填充并显示第二个具有另一个剑道网格的局部视图。它还使用另一个网格填充并显示第三个局部视图。

如果我在第二个kendo网格中选择一行，我希望它将数据插入第三个网格正在使用的数据库表中，我希望它用新数据刷新第三个网格。

我还在每行的第3个网格中有一个自定义按钮（退出），它还需要通过删除已退役的项目来更新同一网格。

任何人都可以帮我解决这个问题吗？我应该使用3个部分视图吗？

Answer 1

我猜你使用局部视图来加载每个网格及其数据，这将有效，但是当在第二个网格上选择一行以填充第三个网格时，您将不得不刷新整个页面

然而，Kendo Grid对远程数据源的效果很好，您可以忽略将数据加载到局部视图中的网格中，并使用一些jQuery来请求第三个网格更新更改事件。

我发现通过Ajax用数据填充网格然后加载页面要快得多 - 但是我有很多数据！

我为人物搜索进行了网格更新，每次搜索文本框更改时都会更新

网格定义为： -

    $("#PersonSearch").kendoGrid({
        columns: [
                    { title: "Organisation", field: "cn", encoded: true },
                    { title: "First name", field: "fn", encoded: true },
                    { title: "Last name", field: "ln", encoded: true },
                    { title: "Type", field: "pt", encoded: true },
                    { title: "Date of birth", field: "db", encoded: true, format: "{0:dd/MM/yy}" },
                    { title: "NHS number", field: "nn", encoded: true }
        ],
        //sortable: { mode: "multiple" },
        change: function () {
            var selected = this.select()
            data = this.dataSource.getByUid(selected.data("uid"));
            if (data.url != "") {
                .... do anything on a row being selected
            }
            else {
                this.clearSelection();
            }
        },
        filterable: false,
        scrollable: { virtual: true },
        sortable: true,
        selectable: true,
        groupable: false,
        height: 480,
        dataSource: {
            transport: { read: { url: "../Person/PeopleRead/", type: "POST" } },
            pageSize: 100,
            serverPaging: true,
            serverSorting: true,
            sort: [
                { field: "cn", dir: "asc" },
                { field: "ln", dir: "asc" },
                { field: "fn", dir: "asc" },
            ],
            serverFiltering: true,
            serverGrouping: true,
            serverAggregates: true,
            type: "aspnetmvc-ajax",
            filter: [],
            schema: {
                data: "Data", total: "Total", errors: "Errors",
                model: {
                    id: "cID",
                    fields: {
                        db: { type: "date", defaultValue: null }
                    }
                }
            }
        }
    });

当搜索框发生变化时，我触发网格填充更多数据： -

$('#GenericSearchString').keyup(function () {
    // get a reference to the grid widget
    var grid = $("#PersonSearch").data("kendoGrid");

    // refreshes the grid
    grid.refresh();
    grid.dataSource.transport.options.read.url = "../Person/PeopleRead/" + $(this).val();
    grid.dataSource.fetch();
});

在Person控制器的服务器端，我有一个方法PeopleRead： -

    [HttpPost]
    public ActionResult PeopleRead(String id, [DataSourceRequest]DataSourceRequest request)
    {
        WebCacheController Cache = ViewBag.Cache;
        if (id == null) id = "";
        string urlBase = Url.Content("~/");

        var PeopleList = from c in db.Connections
                         where c.Person.Firstname.Contains(id) || c.Person.LastName.Contains(id) 
                         select new
                         {
                             oID = c.Organisation.OrganisationID,
                             connID = c.ConnectionID,
                             cn = c.Organisation.Name,
                             fn = c.Person.Firstname,
                             pt = 
                               (
                                   c.Type == ModelEnums.ConnectionTypes.Customer ? "Customer" :
                                   c.Type == ModelEnums.ConnectionTypes.Owner ? "Owner" :
                                   c.Type == ModelEnums.ConnectionTypes.Service_User ? "Service user" :
                                   c.Type == ModelEnums.ConnectionTypes.Worker ? "Worker" :
                                   c.Type == ModelEnums.ConnectionTypes.Profile ? "Profile" : "Unknown"
                               ),
                             url =
                               (
                                   c.Type == ModelEnums.ConnectionTypes.Customer ? "" :
                                   c.Type == ModelEnums.ConnectionTypes.Owner ? "" :
                                   c.Type == ModelEnums.ConnectionTypes.Service_User ? urlBase + "ServiceUser/Details/" :
                                   c.Type == ModelEnums.ConnectionTypes.Worker ? urlBase + "Worker/Details/" :
                                   c.Type == ModelEnums.ConnectionTypes.Profile ? "" : ""
                               ),
                             ln = c.Person.LastName,
                             nn = c.Person.NHSNumber,
                             db = c.Person.DateOfBirth
                         };


        DataSourceResult result = PeopleList.ToDataSourceResult(request);
        return Json(result);
    }

很抱歉这个例子有点偏离主题，但我最好以工作代码为例。

在您的情况下，第二个网格的更改：将更改grid3.dataSource.transport.options.read.url，然后执行grid3.dataSource.fetch（）;

我必须在mvc项目中包含引用kendo.mvc以及更多内容，以及cshtml中kendo.aspnetmvc.min.js的链接。

在MVC 3中，在另一个局部视图Kendo Grid中选择一行后，如何在局部视图中刷新kendo网格？

1 个答案: