具有k-detail-template的KendoUI kendo-grid不会触发更新

时间:2016-09-28 13:10:43

标签: angularjs kendo-ui kendo-grid

我遇到了一个将k-detail-template作为行结构的kendo-grid问题。 KendoUI版本是v2014.3.1411(Kendo UI Q3 2014 SP2)

这是html代码:

<div kendo-grid="mainGrid" id="mobileRole" k-options="mainGridOptions">
    <div k-detail-template>
        <div id="users_#= id #" kendo-grid k-options="loadUsers(dataItem)"></div>
    </div>
</div>

当我编辑主行时,单击图片中可以看到的按钮... enter image description here

我可以编辑主行标签(即“RoleBA_test”),然后成功修改了行,但是当我刷新网格时,它再次显示旧标签,这意味着更新已在本地进行,但尚未触发到服务器。

当我删除

时会发生奇怪的事
<div k-detail-template>

在这种情况下,更新成功触发到服务器,即使在网格刷新后行也会保持修改。 这是mainGridOptions和加载用户的角度javascript代码:

mainGridOptions

    $scope.mainGridOptions = gridOptions({
        dataSource: jData({
            read: {
                url: function (data) {
                    return "api/read/rest_call";
                }
            },
            update: {
                url: function (data) {
                    return "api/update/rest_call";
                },
                beforeSend: function () {
                    blockUI.start();
                },
                complete: function (data, status) {
                    $scope.$evalAsync(function () {
                        blockUI.stop();
                        if (status.toLowerCase() != 'error') {
                            $scope.editing = false;
                        } else {
                            //error
                        }
                    });
                },
                global: false
            },
            destroy: {
                url: function (data) {
                    return "api/destroy/rest_call
                },
                beforeSend: function () {
                    blockUI.start();
                },
                complete: function (data, status) {
                    $scope.$evalAsync(function () {
                        blockUI.stop();
                        if (status.toLowerCase() != 'error') {
                            $scope.editing = false;
                        } else {
                            //error
                        }
                    });
                },
                global: false
            },
            create: {
                url: function (data) {
                    return "api/create/rest_call";
                },
                beforeSend: function () {
                    blockUI.start();
                },
                complete: function (data, status) {
                    $scope.$evalAsync(function () {
                        blockUI.stop();
                        if (status.toLowerCase() != 'error') {
                            $scope.editing = false;
                        } else {
                            alertify.alert(data.statusText);
                        }
                    });
                },
                global: false
            },
            model: {
                id: "id",
                fields: {
                    id: {
                        type: "number"
                    },
                    name: {},
                }
            }
        }).dataSource,
        sortable: true,
        columnMenu: true,
        resizable: true
    });

loadUsers

$scope.loadUsers = function (dataItem) {
return gridOptions({
    dataSource: jData({
        read: {
            url: function () {
                return "api/read/rest_call/";
            }
        },
        model: {
            id: "id",
            fields: {
                id: {
                    type: "number"
                },
            }
        }
    }).dataSource,
    sortable: true,
    columnMenu: true,
    width: '90%',
    resizable: true,
    dataBound: function (e) {
        onDataBound.call(this, 'mobileRoleUsers', dataItem);
    }
});
};

有没有人遇到同样的问题?

谢谢大家。

1 个答案:

答案 0 :(得分:0)

虽然我使用的是最新版本2017.1.223,但我遇到了同样的问题。

我试图找到一些解决方案, 我刚刚发现一个事实,即“k-detail-template”属性只能替代“data-k -...”格式,例如兼容HTML标记。

我认为“k-detail-template”在角度方面存在一些问题。