KendoUI Grid在带有可编辑模板的弹出模式下不调用更新功能

Question

我在AngularJS中使用Kendo UI网格。网格具有“弹出”模式可编辑剑道模板。网格调用创建，销毁和删除功能。但是更新函数不会被调用。奇怪的是，当我将编辑模式更改为“内联”时，将调用更新函数。以下是我的应用程序中的代码片段：

主UI网格：

<div class="container-fluid">
    <kendo-grid style="margin-top: 2em" k-options="ctrl.fundGridOptions" k-scope-field="kgrid" id="myGrid"></kendo-grid>
</div>

编辑模板：

<script id="edit-template" type="text/x-kendo-template">
<div class="container">
    <div class="well">
        Fund :
        <select kendo-drop-down-list k-options="ctrl.fundOptions" style="width: 130px;" ng-model="dataItem.GenevaId"></select>
        <!--<select kendo-drop-down-list k-data-source="ctrl.funds" style="width: 130px;" ng-model="dataItem.GenevaId"></select>-->
        NAV Change Threshold
        <input kendo-numeric-text-box k-min="0" k-max="100" k-ng-model="value" style="width: 60px;" ng-model="dataItem.NAVThreshold" />
        NAV Source
        <select k-data-source="ctrl.navSources" kendo-drop-down-list k-option-label="'-Select-'" style="width: 130px;" ng-model="dataItem.NAVSource"></select>
        Frequency
        <select k-data-source="ctrl.frequencyList" kendo-drop-down-list k-option-label="'-Select-'" style="width: 130px;" ng-model="dataItem.Frequency"></select>
        Type
        <select k-data-source="ctrl.typeList" kendo-drop-down-list k-option-label="'-Select-'" style="width: 130px;" ng-model="dataItem.Type"></select>
    </div>
    <div kendo-grid="ctrl.currencyKendoGrid" style="margin-top: 2em" k-options="ctrl.currencyGridOptions"></div>
</div>
</script>

网格选项：

ctrl.fundGridOptions = {
    dataSource: {
        transport: {
            update: function (options) {
                DataSvc.updateFund(e.data).then(function (response) {
                    e.success(e.data);
                });
            },
        },
        schema: {
            model: {
                id: "FundId",
                fields: {
                    FundId: { type: "number", editable: false, nullable: true },
                    GenevaId: { type: "string", editable: true },
                    NAVThreshold: { type: "number", editable: true },
                    NAVSource: { type: "string", editable: true },
                    Frequency: { type: "string", editable: true },
                    Type: { type: "string", editable: true },
                }
            }
        },
    },
    sortable: true,
    columns: [
         { field: "GenevaId", title: "Fund Name" },
         { field: "NAVThreshold*100", title: "NAV Threshold", template: '#=kendo.format("{0:p}", NAVThreshold)#' },
         { field: "NAVSource", title: "NAV Source" },
         { field: "Frequency", title: "Frequency" },
         { field: "Type", title: "Type" },
         { command: ["edit", "destroy"], title: " " }
    ],
    detailTemplate: kendo.template($("#detail-template").html()),
    detailInit: function (e) {
        kendo.bind(e.detailRow, e.data);
    },
    dataBound: function (e) {
        var grid = e.sender;
        if (grid.dataSource.total() == 0) {
            var colCount = grid.columns.length;
            $(e.sender.wrapper)
                .find('tbody')
                .append('<tr class="kendo-data-row"><td colspan="' + colCount + '" class="no-data">Sorry, no data :(</td></tr>');
        }
    },
    editable: {
        mode: "popup",
        template: kendo.template($("#edit-template").html()),
        window: {
            title: "Edit Fund Details",
            animation: false,
            height: "600",
            width: "1200"
        }
    },
    edit: function (e) {
        if (e.model.Currencies)
            ctrl.currencyKendoGrid.dataSource.data(e.model.Currencies);
    },
    toolbar: [
        {
            name: 'create',
            text: 'Add Fund',
        }],
};

有人能帮我理解为什么'update'函数不会在'popup'模式下被调用，而在'inline'模式下被调用的原因吗？提前感谢您的答复。

Answer 1

我知道这是一个古老的问题，但是我偶然发现了这个问题，寻找答案。我认为问题可能是您（和我）的编辑模板使用ng-model绑定来编辑dataItem，即我们正在使用angularjs。这实际上似乎并没有改变dataItem上的dirty属性。我通过在每个控件上使用ng-change解决了这个问题。这很痛苦，但似乎行得通。

   <input id="Title" type="text" class="k-textbox" ng-model="dataItem.Title" ng-change="dataItem.dirty=true"/>