Отфильтровать локальный источник данных кендо на основе другого атрибута выбранного значения в раскрывающемся списке.

У меня есть ЛОКАЛЬНЫЙ источник данных Кендо, который имеет следующие значения:

var dataSourceSearchOperators = new kendo.data.DataSource({
    data: [
    { OPERAND: "=", DATATYPE: "num", INFO: "Equal", OPERATOR: "eq" },
    { OPERAND: "<>", DATATYPE: "num", INFO: "Not Equal", OPERATOR: "nq" },
    { OPERAND: ">", DATATYPE: "num", INFO: "Greater Than", OPERATOR: "gt" },
    { OPERAND: "CW", DATATYPE: "text", INFO: "Contains Word", OPERATOR: "contains" },
    { OPERAND: "CP", DATATYPE: "text", INFO: "Contains Partial", OPERATOR: "" },
    { OPERAND: "NC", DATATYPE: "text", INFO: "Does Not Contain", OPERATOR: "" },
    ],
});

У меня есть раскрывающийся список, привязанный к удаленному источнику данных Kendo, и я хочу настроить фильтрацию в этом удаленном источнике данных на основе выбранного значения DATATYPE из локального. Оба источника данных имеют общий атрибут DATATYPE. Я в основном фильтрую результаты для второго DDL. Например:

Выбранное значение DDL1 равно ‹>. Затем покажите мне только значения в DDL2 (удаленный источник данных отфильтрован) с DATATYPE='num'.

Я не хочу использовать функцию каскада. (используя javascript).

Спасибо!


person ripsin    schedule 25.10.2013    source источник


Ответы (1)


Вам просто нужно следить за событием select в раскрывающемся списке. Когда значение изменится, получите оператор из выбранного элемента, создайте из него объект фильтра и передайте его в DataSource.filter() на удаленном источнике данных.

Рабочий jsFiddle.

var dataSourceSearchOperators = new kendo.data.DataSource({
    data: [
    { OPERAND: "=", DATATYPE: "num", INFO: "Equal", OPERATOR: "eq" },
    { OPERAND: "<>", DATATYPE: "num", INFO: "Not Equal", OPERATOR: "neq" },
    { OPERAND: ">", DATATYPE: "num", INFO: "Greater Than", OPERATOR: "gt" }
    ]
});

var dataSourceToFilter = new kendo.data.DataSource({
    data: [
        { value: 1 },
        { value: 2 },
        { value: 3 },
        { value: 4 }
    ],
    schema: {
        model: {
            value: { type: "number" }
        }
    }
});

var onFilterOperatorSelected = function (selectEvent) {
    var operator = selectEvent.sender.dataItem(selectEvent.item.index()).OPERATOR;
    var filter = {
        field: "value",
        operator: operator,
        value: 2
    };
    dataSourceToFilter.filter(filter);
};

$("#operators").kendoDropDownList({
    dataSource: dataSourceSearchOperators,
    dataTextField: "INFO",
    dataValueField: "OPERAND",
    select: onFilterOperatorSelected
});

$("#list").kendoListView({
    dataSource: dataSourceToFilter,
    template: "<li>${value}</li>"
});
person CodingWithSpike    schedule 26.10.2013
comment
Это было не совсем то, что я искал, но мне удалось использовать событие выбора, как вы упомянули, для моего фильтра. Это был полезный пример. Единственная часть, на которой я застрял, — это применение фильтра к раскрывающемуся списку2, который заполняется источником данных2 (мой локальный источник данных показывает все) на основе текущего значения в раскрывающемся списке1 (удаленный источник данных). Если вы посмотрите на мой пример, я хочу получить «DATATYPE» из раскрывающегося списка1 и применить его к результатам раскрывающегося списка2. Надеюсь, это имеет смысл. - person ripsin; 28.10.2013
comment
Разве это не было бы в основном тем же самым? Если DDL2 привязан к источнику данных, давайте назовем его ddl2DataSource, тогда вы просто сделаете: ddl2DataSource.filter({ field: 'DATATYPE', operator: 'eq', value: ddl1SelectedItem.DATATYPE }); верно? Или я что-то еще упускаю? Можете ли вы поместить все это в jsFiddle или jsBin в качестве примера? - person CodingWithSpike; 29.10.2013
comment
Прошу прощения, если это не максимально оптимизировано, но здесь вы можете увидеть, с чем я работаю. Если у вас есть предложения, как я могу сделать это менее сложным, это тоже было бы здорово. Спасибо за помощь, жду вашего ответа. ссылка JSFiddle - person ripsin; 29.10.2013