javascript Kendo Ui 组合框 - 设置默认值

Kendo Ui combobox - set default value

提问by user3573096

I successfully filled my combobox. But now I'm trying to set default value for combobox. For example let's say third value from source. This is my input and datasource:

我成功地填充了我的组合框。但现在我正在尝试为组合框设置默认值。例如，假设来自源的第三个值。这是我的输入和数据源：

<script>
viewModel.dataSourceType = new kendo.data.DataSource({
    transport: {
        read: {
            url: "/api/Type/Get",
            dataType: "json"
        }
    },
    schema: {
        id: "Id",
        data: "Data",
        model: {
            id: "Id",
            fields: {}
        }
    }
});

<input id="type"
 data-role="combobox"
 data-value-primitive="true"
 data-auto-bind="true"
 data-text-field="Name"
 data-value-field="Id"
 data-bind="value: model.Id, source: dataSourceType">

It's probably really easy but I'm strugling with that. Thank you.

这可能真的很容易，但我正在为此苦苦挣扎。谢谢你。

回答by Petur Subev

I assume you look for the indexconfiguration option.

我假设您寻找索引配置选项。

回答by OnaBai

Likely the problem is in your modeldefinition, i.e. what you are binding to the combobox.

问题可能出在您的model定义中，即您绑定到组合框的内容。

According with your definition your JavaScript should be something like:

根据您的定义，您的 JavaScript 应该是这样的：

var dataSource = new kendo.data.DataSource({
    type: "odata",
    transport: {
        ...
    }
});

var model = new kendo.observable({
    dataSourceType: dataSource,
    model : { Id: 2 }
});
kendo.bind($("#type"), model);

Where 2is the value that you want as default (initial) value.

2您想要作为默认（初始）值的值在哪里。

Realize that I have had to declare an extra modelfor Idsince you say in your data-binddefinition that valueis model.Id.

意识到我不得不声明一个额外的modelforId因为你在你的data-bind定义中说的value是model.Id.

Maybe you wanted to say:

也许你想说：

var model = new kendo.observable({
    dataSourceType: dataSource,
    Id: 2
});
kendo.bind($("#type"), model);

And then you should define the HTML as:

然后你应该将 HTML 定义为：

<input id="type"
    data-role="combobox"
    data-value-primitive="true"
    data-auto-bind="true"
    data-text-field="Name"
    data-value-field="Id"
    data-bind="value: Id, source: dataSourceType">

$(document).ready(function() {
  var dataSource = new kendo.data.DataSource({
    type: "odata",
    serverFiltering: true,
    transport: {
      read: {
        url: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Products",
      }
    }
  });
  var model = new kendo.observable({
    dataSourceType: dataSource,
    Id: 2
  });
  kendo.bind($("#cbox"), model);

});

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.common.min.css" />
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.default.min.css" />
<script src="http://cdn.kendostatic.com/2014.3.1119/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.3.1119/js/kendo.all.min.js"></script>

<input id="cbox"
       data-role="combobox"
       data-value-primitive="true"
       data-auto-bind="true"
       data-text-field="ProductName"
       data-value-field="ProductID"
       data-bind="value: Id, source: dataSourceType">

回答by Mohammed Farooq

You can achieve like this.

你可以这样实现。

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

you need to pass the index value to select(index).

您需要将索引值传递给 select(index)。

Refer this http://jsfiddle.net/NdPze/63/

请参阅此http://jsfiddle.net/NdPze/63/