Synchronous binding to data source

[Gary]

I keep hitting a timing issue whereby reading the value() of the DropDownList is not correct unless the dataSource binding has been completed. How do I configure the DropDownList so that it is bound to its dataSource synchronously?

I know I can attach code to the change event, but this isn't feasible because I need to ensure all DropDownLists are populated on the page rather than just one. I tried declaring the dataSource separately and calling read() explicitly, but the dataSource is read a second time when it is bound to the DropDownList. I tried binding to the view() method as well, but this had no data.

Can you help?

Gary

[Georgi Krustev]

Hello Gary,

 
If you set autoBind to true, the widget will retrieve the data on initialization. Let me know if I am missing something.

Regards,
Georgi Krustev
the Telerik team

[Gary]

I tried setting autoBind explicitly to true (even though that it is the default value), but it still doesn't work as expected.

Here is a snippet of my code.

                 var stateDataSource = new kendo.data.DataSource({

                transport: {

                    read: "/Agent/StateProvinceData"

                },

                type: "json"

            });

            kState = $content.find("#reports-state").kendoDropDownList({

                dataSource: stateDataSource,

                autoBind: true,

                dataTextField: "name",

                dataValueField: "id",

                optionLabel: "Any State"

            }).data("kendoDropDownList");

            //window.setTimeout(function () {

                console.log("create state");

                console.log(kState.options.dataSource._data);

            //}, 1000);

If I uncomment the two lines above, then I can see the populated results, otherwise an empty array is logged.

[Georgi Krustev]

Hello Gary,

 
In this case you will need to wire the change event of the DataSource. It will notify you when the DataSource was able to retrieve the data from the remote source. 

Greetings,
Georgi Krustev
the Telerik team

[Gary]

Hello Georgi,

Please see my original posting for an explanation why this is not a viable approach.

Still looking for assistance...

Thanks,
Gary

[Georgi Krustev]

Hello Gary,

 
Sorry for missing the first post. In that case you will need to use jQuery Defferred object. Check this jsFiddle demo, which shows how to achieve your goal. 

Kind regards,
Georgi Krustev
the Telerik team

[Gary]

Wow... impressive! It would be nice if this was supported by the control to avoid having to write all this complex plumbing code, but I do appreciate you finding a solution. Thank you.