Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

EXT.Net - Working with Cascading Dropdown

0.00/5 (No votes)
10 Sep 2015 1  
This will help developer to implement the chained combo-box using EXT.Net framework

Introduction

Sometime we have a requirement to show the cascading dropdowns. Like depend upon the selection of the first combo-box, you have to hide/show another combo-box. You can implement it using the EXT.Net DirectEvent.

Background

This solution helps EXT.Net developer to create the cascading combo.

Using the code

Assume that there is a requirement that says the fields should be organized in a hierarchy whereby the answer to the parent question should determine if the child questions are visible in the form view.

e.g. if "Combo-box1" is set to "Yes", then another child fields "Combo-box2"would become visible. If No was selected, they 2nd one would be hidden.

<ext:ComboBox FieldLabel="Combo-box1" AutoCompleteType="Disabled"
        runat="server" Hidden="true" ID="ddlCombobox1" dataType="Boolean">
        <DirectEvents>
            <Select OnEvent="ddlCombobox1_ItemSelected">
            </Select>
        </DirectEvents>
</ext:ComboBox>

<ext:ComboBox FieldLabel="Combo-box2" AutoCompleteType="Disabled"
        runat="server" Hidden="true" ID="ddlCombobox2" dataType="Boolean">
</ext:ComboBox>

 

The above code snippet illustrate that there are two drop-down ddlCombobox1 and ddlCombobox2. ddlCombobox1 has a DirectEvents for Select event.

<DirectEvents>
            <Select OnEvent="ddlCombobox_ItemSelected">
            </Select>
</DirectEvents>

You can handel the event at code behind side as below.

/// <summary>
/// Direct Event for ddlCombobox1
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void ddlCombobox1_ItemSelected(object sender, Ext.Net.DirectEventArgs e)
{
            

string selectedText = ddlCombobox1.SelectedItem.Text;

if (selectedText == "No")
{
                ddlCombobox2.SetValueAndFireSelect(0);
                ddlAccessGroundDisturbance.Hidden = true;
                ...
}
else
{
                ddlCombobox2.Hidden = false;
                ...

}
}

You may have to deal with the codebehind depend upon your page life cycle and events and you are done.

Thanks

Conclusion

This solution helps EXT.Net developer to create the cascading combo.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here