Столбец номера сетки пользовательского интерфейса Kendo с шаблоном не фильтруется

Я создал сетку пользовательского интерфейса Kendo с двумя столбцами. Один - это просто число под названием num0. другой называется num1, и его данные создаются из num0 с помощью шаблона.

Фильтр по num0 работает найди. Появится фильтр на num1, и вы можете его использовать, но совпадений не найдено. то есть: отфильтруйте по num1 и выберите «Равно» и введите «2», затем нажмите «Фильтр», и сетка очистится, когда должна была отображаться первая запись.

Кроме того, я сделал столбец num0 редактируемым, а столбец num1 - недоступным. Я бы хотел, чтобы столбец num1 изменился при редактировании num0.

Я думаю, это как-то связано с «шаблоном», который я использую для заполнения столбца num1.

Что мне нужно сделать, чтобы это исправить и фильтр заработал?

Спасибо

http://jsfiddle.net/elbarto99/acyxekgx/

$(document).ready(function()
{
    // Define the datasource for the grid.
    var dsNums = new kendo.data.DataSource({
        // NOTE: I don't want a num1: data field set to static values.
        //       I would like one that is set from "num0 + 1" and when num0 data is edited
        //       num1 would be updated to "num0 + 1"
        data: [
            { num0: 1 },
            { num0: 2 },
            { num0: 3 },
            { num0: 4 },
        ],
        schema:
        {
            model:
            {
                id: "myGridID",
                fields:
                {
                    num0: { type: "number"  },
                    num1: { type: "number", editable: false  },
                }
            }
        }

    });

    // Create the grid.
    var _grid = $("#grid").kendoGrid({
        dataSource: dsNums,
        filterable: { extra: false },
        editable: true,
        columns: [
            { field: "num0" , title: "Num 0" , width: "90px", },
            // Add 1 to num0 and display in num1 column
            // Note: A filter shows up and is for numbers but doesn't work
            //       I think it doesn't work because I am using a template.
            //       
            //       What do I need to do to make the filter for column num1 work like it does for num0?
            { field: "num1" , title: "Num 1 - Filter shows up but doesn't find matchs. :-(" , width: "90px", template: "#= num0 + 1 #", },
        ],
    }).data("kendoGrid");

});

person elbarto99se    schedule 20.01.2015    source источник


Ответы (2)


num1 значение не является частью данных, поэтому фильтр не будет фильтровать по нему. Фильтры работают на уровне источника данных, а не представления.

Что вы можете сделать, так это вычислить то же значение в функции schema.parse. Что-то типа:

    parse: function(d) {
        $.each(d, function(idx, elem) {
            elem.num1 = elem.num0 + 1;
        });
        return d;
    }  

Ваш JSFiddle изменен здесь: http://jsfiddle.net/OnaBai/acyxekgx/2/

person OnaBai    schedule 20.01.2015
comment
Это отлично сработало, я могу фильтровать по 2, и он фильтрует. ‹Br/› Я не могу нажать Enter в этом поле для комментариев stackoverflow. поэтому я использую теги br. ‹Br/› Если я сделаю столбец num0 редактируемым, есть ли способ обновить столбец num1 при изменении num0? - person elbarto99se; 23.01.2015

Спасибо, OnaBai: я изменил ваш jfiddle и добавил некоторые редактируемые настройки, поэтому столбец num0 можно редактировать, а столбец num1 нельзя редактировать.

Есть ли способ обновить данные и представление num1 до num0 + 1, если num0 редактируется? то есть: num0 изменен на 11, данные num1 будут изменены на num0 + 1 или 12, а фильтр по num1, чтобы найти 12, отобразит строку 1.

Также установите для представления num1 значение 12, чтобы пользователь мог видеть изменение.

http://jsfiddle.net/elbarto99/acyxekgx/

// Define the datasource for the grid.
var dsNums = new kendo.data.DataSource({
    // NOTE: I don't want a num1: data field set to static values.
    //       I would like one that is set from "num0 + 1" and when num0 data is edited
    //       num1 would be updated to "num0 + 1"
    data: [
        { num0: 1 },
        { num0: 2 },
        { num0: 3 },
        { num0: 4 }
    ],
    schema:
    {
        model:
        {
            id: "myGridID",
            fields:
            {
                num0: { type: "number"  },
                num1: { type: "number", editable: false  }
            }
        },
        // This changes the data for num1 at load time but
        // if the data in num0 is edited this doesn't change data for num1
        // at edit time.
        parse: function(d) {
            $.each(d, function(idx, elem) {
                elem.num1 = elem.num0 + 1;
            });
            return d;
        }        
    } 
});

// Create the grid.
var _grid = $("#grid").kendoGrid({
    dataSource: dsNums,
    filterable: { extra: false },
    editable: true,
    columns: [
        { field: "num0", title: "Num 0", width: "90px" },
        { field: "num1", title: "Num 1", width: "90px" }
    ]
}).data("kendoGrid");
person elbarto99se    schedule 23.01.2015