Kendo Ui combobox - set default value

Question

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.

Answer 1

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

Answer 2

Likely the problem is in your model definition, ie what you are binding to the combobox.

According with your definition your JavaScript should be something like:

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

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

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

Realize that I have had to declare an extra model for Id since you say in your data-bind definition that value is 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:

<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"> 

Answer 3

You can achieve like this.

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

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

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