DropdownList dataSource.read and refresh the parameters

[Ross B.]

Greetings,

I have a problem that probably has a simple solution that I am overlooking. I have created a widget to extend Kendo widget. In the widget I have a DropDownList that seems to "cache" the read.data. I want to be able to have the datasource re-read the data on each post. In the code below the initial read has the correct values, however, when I call datsource.read the data function is not being called again as I would expect. 

that.divTestDropDownList.kendoDropDownList({
    dataTextField: "TypeName",
    dataValueField: "TypeID",
    dataSource: {
        transport: {
            read: {
                dataType: "json",
                url: that.options.testUrl,
                data: getTestData()
            }
       }
  }


function getTestData() {
    return {
        testID: that.divOtherDropDownList.val()
    }
 };

//When I Call that.divPlayListDropDownList.data("kendoDropDownList").dataSource.read();
//in response to another control change the testID does not change
//although I can see it has changed in the console

[Georgi Krustev]

Hello Ross,

 
By default, the data source will cache the retrieved data and will not perform additional requests to the server. To enable request on each filter, you will need to set the serverFiltering option to true. Check how this is done in the cascading dropdownlists demo.

Regards,
Georgi Krustev
Telerik

[Ross B.]

Thanks for your reply. I can't use the cascade example because the parent dropdowns are optionally rendered. The server filtering does not seem to work for me. I made a test:
1. set the read.data : getUniqueValue()
2. make unique value function return a unique value.
3. When the control is instantiated the value sent to the server is unique for that instance
4. When I make the drop down refresh for an instance I get the same value as when it was first called.

Create Widget
    Drop Down List Data Bind() --> Value=1
    Drop Down List .datasource.read() --> Value=1
    Drop Down List .datasource.read()  --> Value=1
    Drop Down List .datasource.read()  --> Value=1
Create Widget
    Drop Down List Data Bind() --> Value=155
    Drop Down List .datasource.read() --> Value=155
    Drop Down List .datasource.read()  --> Value=155
    Drop Down List .datasource.read()  --> Value=155
Create Widget
    Drop Down List Data Bind() --> Value=216
    Drop Down List .datasource.read() --> Value=216
Create Widget
    Drop Down List Data Bind() --> Value=876
...

I would like to see:
Create Widget
    Drop Down List Data Bind() --> Value=452
    Drop Down List .datasource.read() --> Value=712
    Drop Down List .datasource.read()  --> Value=923
    Drop Down List .datasource.read()  --> Value=234

Thanks,
Ross

[Ross B.]

After trial and error it seems I have to make an ajax call for each refresh after the initial. This works:

that.divPlayListDropDownList.data("kendoDropDownList").dataSource.data(anAjaxCall.response);

Perhaps there is a better way?

[Georgi Krustev]

Hello Ross,

After further investigation of the provided code snippet I noticed that data callback is set to the result of the result of the getTestData method and not the method itself. You can fix this like this:

that.divTestDropDownList.kendoDropDownList({
    dataTextField: "TypeName",
    dataValueField: "TypeID",
    dataSource: {
        transport: {
            read: {
                dataType: "json",
                url: that.options.testUrl,
                data: getTestData
            }
       }
  }

Please note the removed parentheses.

Regards,
Georgi Krustev
Telerik

[Ross B.]

Thanks Georgi! That solved my problem.