1

テンプレートで定義された列があります：「object.type」で、ドロップダウンリストです（検索するタイプが複数あります）。

エディターがあります：

                editor : function (container, options) {
                        $('<input data-text-field="display" data-value-field="id" data-bind="value:' + options.field + '"/>')
                            .appendTo(container)
                            .kendoDropDownList({
                                index: 0,
                                dataTextField: "display",
                                dataValueField: "id",
                                dataSource: usergroupConf.permissions
                            });
                    },

したがって、この列の要素は、キー id と display を持つオブジェクトです。

{
  "id":"1",
  "display":"Big"
}

これで、その列のフィルター可能なプロパティを定義しました。

                filterable : {
                    extra : false,
                    ui : function(element) {
                        element.kendoDropDownList({
                            index: 0,
                            dataTextField: "display",
                            dataValueField: "id",
                            dataSource: usergroupConf.permissions
                        });
                    }
                }

フィルターボックスをクリックすると、フィルターは正常に表示されますが、そこから値を選択するとエラーが発生します:

Uncaught TypeError: undefined is not a function

つまり、要するに、

ドロップダウンである剣道のグリッドの列をフィルタリングする方法は?

4

1 に答える 1

2

それで、大規模な研究の後、soulutionは次のようになります。剣道グリッドで外部キーを使用します。

  1. ドロップダウンで選択した値のキーである追加フィールドを作成します

  2. その列の場合、ドロップダウンにバインドされるクレートエディターで、この新しいフィールドが変更されます

            {
            field: 'permission_id',
            title : 'Permission',
            // values : usergroupConf.permissions,
            template : "#= permission.display #",
            editor : function (container, options) {
                // bind it to permission, but update permission_id as well (because of enabled filtering)
                $('<input data-text-field="display" data-value-field="id" data-bind="value:permission"/>')
                    .appendTo(container)
                    .kendoDropDownList({
                        index: 0,
                        dataTextField: "display",
                        dataValueField: "id",
                        dataSource: usergroupConf.permissions,
                        select : function(e) {
                            options.model.permission_id = this.dataItem(e.item.index()).id;
                        }
                    });
            },
            filterable : {
                extra : false,
                ui : function(element) {
                    element.kendoDropDownList({
                        dataSource: usergroupConf.permissions,
                        dataTextField: "display",
                        dataValueField: "id",
                        optionLabel: "--Select Value--"
                    });
                }
            }
        },

  3. これがデータソースです

        dataSource: new kendo.data.DataSource({
        // pageSize: 10,
        serverPaging: false,
        schema: {
            model: {
                id : 'id',
                fields: {
                    'id' : {},
                    'name' : {
                        editable : false,
                        nullable : false
                    },
                    'permission' : {
                        editable : true
                    },
                    'permission_id' : { // we'll have permission_id to enable filter (kendo doesn't support filtering through objects (what permission column is) by default)
                        editable : true,
                        type : 'number'
                    }
                }
            }
        },

最終的に、データを入力するときは、オブジェクトとして許可を追加する必要があります。

{
  "id":1
  "display":"Move"
}

と

permission_id:1
于 2014-07-11T09:48:19.990 に答える