Saturday, 7 September 2013

how to use ajax drop down extender

how to use ajax drop down extender 

   This example explains how to use Drop Down Extender for TextBox.
         Controls Used:TextBox, Panel with ListBox DropDown Extender

1) Create Website
2) Add aspx page
3) Add toolkitScriptManager
4) If you don't have ajax control toolkit  download from codeplex
5) Add DropDown Extender

asp:DropDownExtender Properties

1) TargetControlID  ->  TextBox/LinkButton/Button where dropdown extender will be called
2)  DropDownImageUrl  this image will be displayed in Textbox
3)  DropDownControlID -> This will be a Panel with DropDown Content

    <asp:TextBox ID="txtLanguage" runat="server"  Width="207px"></asp:TextBox>
    <asp:Panel ID="Panel1" runat="server" Width="250px">
       <asp:ListBox ID="ListBox1" runat="server" Width="200px" 
                   AutoPostBack="true" OnSelectedIndexChanged="ListBox1_SelectionChanged">
                    <asp:ListItem Text="C#" Value="C#"></asp:ListItem>
                    <asp:ListItem Text="VB.NET" Value="VB.NET"></asp:ListItem>
                     <asp:ListItem Text="F#" Value="F#"></asp:ListItem>


    <asp:DropDownExtender ID="DropDownExtender1" runat="server" 
     DropDownControlID="Panel1" DropArrowWidth="50" 
     DropArrowImageUrl="~/drop.jpg" TargetControlID="txtLanguage">

No comments:

Post a Comment