Kettic DropDownTree controls provides a variety of functionalities for users to create a customized DropDownTree structure in their ASP.NET AJAX application. We have introduced settings for checkboxes, delimiters, buttons, filtering, etc. In this tutorial, we will be mainly focusing on the some features settings of Kettic DropDownTree control.

AutoWidth: This property can be customized and applied so that it can enlarge the width of a DropDownTree when nodes are expanded, and shrinks the width of the DropDownTree when nodes are collapsed. This property comes very handy, and is used in many of the popular applications and software / site interface.

OpenDropDownOnLoad: This function allows you to open the DropDown automatically and immediately when the page is loaded. This function is quite commonly used for quite a number of scenarios.

CssClass: This functionality enables you to set a custom css class so that you can find it so easy to alter / modify the appearance of the DropDownTree. By setting the css class, you can easily control the look and feel of an entry item, image, color, skins and so on.

Width: In addition, you can also customize this property if you want to create a DropDown with a user-defined width. At the moment there is no limit for this width, so you can simply input a value for the DropDown width as you wish.

Height: Last but not the least, you can also customize the height of your DropDownTree by setting this "Height" property. All you need to do is simply assign a value to this property as it is required to create a desired DropDownTree.

Here are the Aspx sample codes to create a DropDownTree with AutoWidth:

<kettic:PerDropDownTree ID="PerDropDownTree1" runat="server" 
                  DefaultMessage="Please select" 
CheckBoxes="SingleCheck" 
Width="250px"
Skin="Forest">
                <DropDownSettings AutoWidth="Enabled" 
OpenDropDownOnLoad="true" 
Height="500" />
            </kettic:PerDropDownTree>