jquery - Populating a Kendo UI DropDownList in an Edit Form

Question

I'm using Kendo UI's DropDownList widget within an edit form and can't seem to set the initial value according to the organisation's ID. I suspect it has everything to do with the 'index' but am stumped as to how to retrieve this information when the edit form fields are populated by a query and the dropdown's options are pulled from remote datasource.

$("#organisations").kendoDropDownList({
            dataTextField: "orgName",
            dataValueField: "organisationID",
            index: 0,
            optionLabel: "-- Select --",
            dataSource: {
                transport: {
                    read: "assets/data/data.clients.php"
                },
            }
        });

Any help is appreciated.

@rrfive

Answer 1

To initially select the item according to the field that you want to edit, you should use the value configuration. Here is an example:

e.g.

$(document).ready(function() {
              var theId = 3;

                $("#products").kendoDropDownList({
                    dataTextField: "ProductName",
                    dataValueField: "ProductID",
                    value:theId,
                    dataSource: {
                        transport: {
                            read: {
                                dataType: "jsonp",
                                url: "http://demos.kendoui.com/service/Products",
                            }
                        }
                    }
                });
            });