How does DataBound Work?

[chobo2]

Hi

I want to have 2 dropdownlists but I want to hide the second list if nothing gets populated into it.

You would first choose from Dropdown A, if the selection of Dropdown A does not populate anything into Dropdown B then I want to hide Dropdown B, If something is populated into Dropdown B then I want to show it.

I thought DataBound Event would do this and be fired each time something switched in A  but what I am noticing, that if I say make a choice in dropdown A which renders a result in Dropdown B then the databound event is triggered, then if I go and make another choice on dropdown A which renders no result in B the databound event is triggered.

However after that no databound event is triggered.

@(Html.Kendo().DropDownListFor(x => x.Country)

 

                                .OptionLabel("Select country...")

 

                                .DataValueField("Code")

 

                                .DataTextField("Name")

 

                                .Filter(FilterType.Contains)

 

                                .DataSource(ds => ds.Read(r => r.Action("GetCountries", "Countries")))

 

                                )

 

 

@(Html.Kendo().DropDownListFor(x => x.State)

                         .OptionLabel("Select State")

                         .DataValueField("Code")

                         .DataTextField("Name")

                         .Filter(FilterType.Contains)

                         .DataSource(ds => ds.Read(r => r.Action("GetStates", "States").Data("getCountryCode")))

                         .CascadeFrom("Country")

                         .Enable(false)

                         .Events(e =>

                          {

                              e.DataBound("onStateDataBound");

                          })

                         )

 

function onStateDataBound(e) {
    if (e.sender.dataSource.data().length <= 0) { // hide } else {// show}

}

 

[Ivan Danchev]

Hi,

I've tested this scenario and can verify that the dataBound event of the State DropDownList fires every time a value is selected in the Country DropDownList (except in the case where the optionLabel is selected). The problem however is not in the dataBound event, it is in the fact that the State DropDownList's dataSource is not configured to use server filtering. As a result:

e.sender.dataSource.data().length

will always return the same value, i.e. the number of all the items in the data, regardless of whether the State DropDownList shows any states in its list or doesn't show any data. And because of that the length <= 0 condition will never get hit.

Consider configuring the dataSource to use server filtering:

.DataSource(ds => ds.Read(r => r.Action("GetStates", "States").Data("getCountryCode")).ServerFiltering(true))

and implement the actual filtering in the GetStates action, based on the value selected in the Country DropDownList. This value can be sent to the GetStates action through the getCountryCode function, and can be used to filter the data and return states, only if a country with corresponding states has been selected.

Regards,
Ivan Danchev
Progress Telerik