Чего не хватает, чтобы мой каскадный DropDownList работал

Здесь показан очень простой случай: http://jsbin.com/ahoYoPi/3/edit

Мне нужно указать, что внутреннее поле дочернего элемента для фильтрации (eq) по полю значения родителя — это «category_id»… Конечно, документация Кендо ничего не говорит о том, как это сделать… Или это что-то такое супер очевидно, что это не заслуживает объяснения?

    var categoriesList = new Array (
    {"id":"1","categoryName":"Fruits"},
    {"id":"2","categoryName":"Vegetables"} );

var productsList = new Array(
    {"id":"1","categorie_id":"1","productName":"Apples"},
    {"id":"2","categorie_id":"1","productName":"Oranges"},
    {"id":"3","categorie_id":"2","productName":"Carottes"},
    {"id":"4","categorie_id":"2","productName":"Patatoes"});

$("#categories").kendoDropDownList({
    dataTextField: "categoryName",
    dataValueField: "id",
    dataSource: categoriesList,
    optionLabel: "----------------" ,
    change: function() {
        $("#products").data("kendoDropDownList").value(0);
    }
});
$("#products").kendoDropDownList({
    cascadeFrom: "categories",
    dataTextField: "productName",
    dataValueField: "id",
    dataSource: productsList,
    optionLabel: "----------------" ,
});

kendo-ui kendo-combobox
person Tuthmosis    schedule 21.08.2013    source источник
comment
Можете ли вы изменить в categoriesList id на categorie_id? Если это так, вы можете сделать это, а затем в первом kendoDropDownList сказать, что dataValueField это categorie_id (см. здесь)   -  person OnaBai    schedule 21.08.2013

Ответы (1)


arrow_upward
4
arrow_downward

Документация по каскадированию доступна здесь: http://docs.kendoui.com/getting-started/web/combobox/cascading

Вот как работает фильтрация:

Если у родителя есть значение, то потомок будет включен и будет фильтровать свои данные в зависимости от него. Вот как будут выглядеть параметры фильтра: field: "parentID", //the dataValueField of the parent operator: "eq", value: "" //parent's value

Это означает, что дочерний раскрывающийся список (поле со списком) будет использовать поле, настроенное через dataValueField родителя, для фильтрации (каскадирования). В вашем случае это не работает, потому что dataValueField родителя имеет значение «id». Однако это поле служит другой цели в массиве productsList.

В настоящее время нет функции, позволяющей указать поле, используемое для каскадирования.

У вас есть два варианта:

  1. Делайте то, что предложил @OnaBai. Переименуйте поле «id» в categoriesList в «categorie_id» и установите dataValueField соответственно.

  2. Реализуйте каскадирование вручную. Сначала удалите параметр cascadeFrom, а затем сделайте это в событии изменения родителя:

    change: function() {
    var products = $("#products").data("kendoDropDownList");

    products.dataSource.filter( {
      field: "categorie_id",
      value: this.value(),
      operator: "eq"
    });

    products.value(0);
}

    Вот живая демонстрация: http://jsbin.com/ogEj/1/edit.

person Atanas Korchev    schedule 21.08.2013