What would be the schema for the secondary datasource of the cascading combobox?

[Patt]

Hi everyone,

I am working on creating cascading combo boxes. I would like to use a data that is being pre-loaded as C# objects, which then will be convert into JSON model and use as a datasource.

I looked at the example code from the cascading combo box demo and realized that it uses Odata points to some web service, which return a large xml-liked file content, which gives me a bit of difficult time understanding how the 1st combo box can be used to determine what get to be displayed on the 2nd combo box.

So if we take cascading combo boxes for country and state as an example. If I were to have the first combo box as a country like this.

        $(".country-combo-box").kendoComboBox({
            dataTextField: "text",
            dataValueField: "value",
            dataSource: [
                { text: "United States of America", value: "US" },
                { text: "Canada", value: "CA" },
                { text: "United Kingdom", value: "UK" },
                { text: "France", value: "FR" }
            ],
            filter: "contains",
            suggest: true,
            index: 0
        });

How would I set up the 2nd combo box, so that if I select the US as a country  and expect the 2nd combo to display on the states that belong to the US although technically the datasource for the 2nd combo box should contains all states for every country?

Would the datasource for the 2nd combo box looks like this? 
 dataSource: [
                { country: "US", text: "New York", value: "NY" },
                { country: "US", text: "Texas", value: "TX" }, 
                { country: "US", text: "Florida", value: "FL" }, 
                { country: "CA", text: "Alberta", value: "AL" }, 
            ], 
If so, how do I set the filter on the 2nd combo box to only select all states for a specific country?

I appreciate your time helping me on this. 

Thank you very much,

Patt






 

[Patt]

Nevermind. I just realized that I used the older version of Kendo UI. 

For those who are interested. Here it is the miminum data schema that we should have for the cascading combo box

1st data source 
                { countryText: "United States of America", countryValue: "US" },
                { countryText: "Canada", countryValue: "CA" },
                { countryText: "United Kingdom", countryValue: "UK" },
                { countryText: "France", countryValue: "FR" }
...

2nd data source
        { countryValue: "US", provinceText: "Florida", provinceValue: "FL" },
                { countryValue: "US", provinceText: "New York", provinceValue: "NY" },
                { countryValue: "US", provinceText: "Texas", provinceValue: "TX" },
                { countryValue: "US", provinceText: "California", provinceValue: "CA" },
...

Note: 2nd data source requires to have a property that come from the value of the 1st one.
As long as define the property on the 2nd combobox  "cascadeFrom" to the id of the first combo box, then we should be good.

Have fuN!