Monday, 19 August 2013

How to Use ASP.NET AJAX TOGGLE BUTTON EXTENDER


How to Use ASP.NET AJAX TOGGLE BUTTON EXTENDER


1)  Create WebSite
2) Add aspx page
3) Add toolkitscript manager
4) Add  CheckBox Control  which requires Toogle button feature( set AutoPostback true,oncheckedchange event handler)
5) Add Toggle Button Extender Control

asp:ToggleButtonExtender   PROPERTIES
1) TARGET CONTROL ID  here CheckBox
2) Checked/Unchecked Image URLs
3) Image height and width(16px)


        <asp:CheckBox  ID="chkLanguage"  runat="server" 
        Text="C#" TextAlign="Right" 
        Font-Size="Larger" Width="100px" Checked="true" OnCheckedChanged="chkLanguage_chekcedcChanged" AutoPostBack="true" />

        <asp:ToggleButtonExtender ID="ToggleButtonExtender1" runat="server"
          TargetControlID="chkLanguage" CheckedImageUrl="~/Images/checked.gif"
           UncheckedImageUrl="~/Images/unchecked.png"
            ImageHeight="16" ImageWidth="16" >

        </asp:ToggleButtonExtender>

4) Add checked state change Event handler 

    protected void chkLanguage_chekcedcChanged(object sender, EventArgs e)
    {
        if (chkLanguage.Checked == true) chkLanguage.Text = "C#";
        else chkLanguage.Text = "VB.NET";
    }

5)  Run the Application



Initial State is Checked ,