【问题标题】:How to prevent Kendo MultiSelect from losing values after editing in a grid template?如何防止 Kendo MultiSelect 在网格模板中编辑后丢失值?
【发布时间】:2018-03-14 19:22:46
【问题描述】:

我有一个显示逗号分隔值列表的网格,它有一个用于网格模板编辑器的数组。 (在服务器上,我将逗号分隔的列表转换为 Kendo 多选 AngularJS 指令的数组)。我几乎可以正常工作:在多选中显示、编辑和添加值。

发生了一件奇怪的事情:在多选中添加一个值后,在编辑器中单击保存,然后重新打开编辑器,多选然后只显示最近输入的值之一.我知道这些值存在并通过管道,因为这些值会进入数据库。我可以刷新页面,打开编辑器,所有值都正确显示在多选中,包括我刚刚添加的那个。

当我重新打开编辑器时,好像剑道“忘记”了大部分值。 如何防止这种情况发生? MultiSelect 是否需要重新设置为值?如果有,怎么做?

我尝试添加this onChange event,但没有效果。我added valuePrimitive 无效。我尝试指定 k-rebind,但它导致了错误。

这是text/x-kendo-template 中使用的指令:

        <select kendo-multi-select
                id="zipCode"
                k-placeholder="'Enter zip codes...'"
                style="width: 225px"
                k-on-change="dataItem.dirty=true"
                k-auto-bind="false"
                k-min-length="3"
                k-enforce-min-length="true"
                k-data-source="options.zipCodeDataSource"
                k-data-text-field="'text'"
                k-filter="'startsWith'"
                k-filtering="options.zipCodeFiltering"
                k-no-data-template="'...'"
                k-ng-model="dataItem.zipArray"
                k-highlight-first="true" />

这是数据源:

options.zipCodeDataSource = new kendo.data.DataSource({
    severFiltering: true,
    transport: {
        read: {
            url: serviceUrl + "ZipCode/Get",
            type: "GET",
            dataType: "json",
            contentType: jsonType,
            data: function (e) {
                // get your widget.
                let widget = $('#zipCode').data('kendoMultiSelect');
                // get the text input
                let filter = widget.input.val();
                // what you return here will be in the query string
                return {
                    filter: filter
                };
            }
        },
    },
    schema: {
        data: "data",
        total: "Count",
        model:
        {
            id: "text",
            fields: {
                text: { editable: false, defaultValue: 0 },
            }
        },
        parse: function (response) {
            return response;
        }
    },
    error: function (e) {
    }
});

如果我在&lt;pre&gt; 中显示{{dataItem.zipArray}},所有预期值都在那里。

我想知道是否需要在剑道网格定义中的编辑事件处理程序中添加一些东西,但我不确定它会是什么。我不得不为下拉列表指令做这样的绑定。

    edit: function (e) {

        if (e.model.marketId === 0) {
            e.container.kendoWindow("title", "Add");
        } else {
            e.container.kendoWindow("title", "Edit");
        }

        // re-bind multi-select here??

        // These two lines actually cause the multiselect to lose pre-existing items in dataItem.zipArray
        // var multiselect = kendo.widgetInstance(angular.element('#zipCode'));
        // multiselect.trigger('change');
    }

...

更新:

This dojo demonstrates the issue

  1. 运行道场
  2. 编辑合同网格中的第一条记录
  3. 添加邮政编码,例如 22250
  4. 点击保存
  5. 然后再次点击第一行的编辑
  6. 编辑器中仅显示邮政编码 22250

另外,我注意到如果我将k-min-length="3" 更改为k-min-length="1",那么问题就会消失。但在我正在处理的场景中,它需要是3

【问题讨论】:

  • 你能为你的问题提供一个 jsfiddle 吗?
  • @Sajeetharan 查看上面的更新dojo.telerik.com/IREVAXar
  • 你检查答案了吗?

标签: angularjs kendo-grid kendo-multiselect


【解决方案1】:

这似乎是剑道本身的问题。当时报告了这个问题here.

好的,根据 Telerik 的回复,此问题已在 2017 R3 SP1 版本 (2017.3.1018) 中修复。您可以使用这个更新的 dojo 示例来验证它:

http://dojo.telerik.com/IREVAXar/3

【讨论】:

  • 你能提供赏金吗? :P
  • 他们已经获得了赏金并且它已经过期了。否则我会的。请注意,在 2016.3.914 版本的 Kendo 和 2017.3.1018 版本之间,他们更改了自动完成指令,使其不再处理数组,而只处理字符串。在我正在处理的应用程序中,我将一些自动完成更改为组合框作为解决方法。这显示了如何使组合框功能类似于自动完成jsfiddle.net/CxSRQ/409
猜你喜欢
  • 2020-06-08
  • 1970-01-01
  • 1970-01-01
  • 2014-03-18
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多