Поле со списком по умолчанию для выбора кендо

Я использую KendoUI ComboBox и хочу установить элемент выбора по умолчанию.

В KendoUI ComboBox я не нашел способа поместить значение по умолчанию в текст, а не в индекс.

<script>
    $("#combobox").kendoComboBox({
        dataSource: [
            { id: 1, name: "Apples" },
            { id: 2, name: "Oranges" }
        ],
        dataTextField: "name",
        dataValueField: "id"
    });

    var combobox = $("#combobox").data("kendoComboBox");

    combobox.select(combobox.ul.children().eq(0));
</script>

Вот пример. Как можно преобразовать его, чтобы поместить текст?


person Imen    schedule 19.11.2014    source источник


Ответы (2)


Как говорит @SatyaRanjanSahoo, вы должны использовать value но вы должны использовать значение id, иначе вы будете принудительно использовать значение, которого может не быть в DataSource.

Пример, если вы делаете:

var combobox = $("#combobox").data("kendoComboBox");
// Set Value
combobox.value("Apricot");
// Get Value
alert("Value is " + combobox.value());

это покажет Apricot, но пока этого нет в DataSource, если вы сделаете:

var combobox = $("#combobox").data("kendoComboBox");
// Set Value
combobox.value(2);
// Get Value
alert("Value is " + combobox.value());

Это покажет Oranges, что является правильным значением для элемента, у которого id равно 2.

Итак, если вы не уверены, что значение, установленное в вызове value, является допустимым dataTextField, я бы рекомендовал использовать функцию dataValueField.

Проверьте это в следующем фрагменте кода...

$("#combobox").kendoComboBox({
  dataSource: [
    { id: 1, name: "Apples" },
    { id: 2, name: "Oranges" }
  ],
  dataTextField: "name",
  dataValueField: "id"
});

var combobox = $("#combobox").data("kendoComboBox");


// Set a valid value
combobox.value("Oranges");
alert("Value for Oranges is: " + combobox.value());

// Set an invalid value
combobox.value("Apricots");
alert("Value for Apricots is: " + combobox.value());
<link href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.common.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2014.2.1008/styles/kendo.default.min.css" rel="stylesheet" />
<script src="http://cdn.kendostatic.com/2014.2.1008/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.2.1008/js/kendo.all.min.js"></script>

<input id="combobox"/>

person OnaBai    schedule 19.11.2014
comment
Хорошо объяснил @OnaBai. - person Satya Ranjan Sahoo; 19.11.2014

Чтобы поместить текст непосредственно в поле со списком:

 var combobox = $("#combobox").data("kendoComboBox");
 combobox.value("Oranges");

Но, используя тот же подход, анонимный текст может быть установлен в поле со списком, которое не является частью источника данных. то есть

  combobox.value("XYZ");

Итак, полезно использовать индекс для установки значения в поле со списком.

person Satya Ranjan Sahoo    schedule 19.11.2014