Welcome to another AJAX tutorial, today we will be demonstrating a simple example of the ToggleButton Extender.

In this tutorial we will be going over the ToggleButton extender and how it can be used in a ASP.NET Webform or WebPage using C#.

The ToggleButton Extender is an ASP.NET AJAX extender that can be attached to an ASP.NET CheckBox control. ToggleButton enables the use of custom images to show the state of the CheckBox. The behavior of the CheckBox is unaffected.

Here is a quick preview of what we will be building.

Open Visual Studio and open a new webform.

In design view we will want to add a tool script manager.

Now right click in the solution explorer and we will add an images folder that will contain two images, we used a thumbs up and thumbs down image since we are building a toggle selection panel.

Now let’s add an update panel to our project.

Now inside of our content template node we will add 2 check boxes and we will also add 2 Toggle button Extenders to each of them. Below is the markup:

As you can see we added an ASP button to invoke the extender and then we supplied a label to display the selected checkbox message.

When you look at the Extender source We set the image height and width and referenced the images we added in our images folder.

Now we code our Button Click event to display the selected value. Below is the method used.

As you can see this is a very simple extender to use and very user friendly.

After loading the site in your browser the page will look like this.

Download Source Files