AJAX - Dynamic Updatable Slider control

A few weeks back one of the project managers in my organisation wanted to migrate a project from windows to thin client environment and as he had seen me boasting about the AJAX framework most of the times, he asked me to do this small task for him . A dynamically Updatable Slidder Control. This requirement was generated as part of a screen, which gathers the insurance deals and hence needs an adjustable upper and lower limit, which can be dragged and adjusted at will.

To dwell upon the same, the reuirement was to have two slidder controls and adjust one when the other is changed so that the total remains the same. Simple !! yeah it is, but still interesting.
Here's how you can approach it....

1) Get your toolkit ready for the AJAX framework - put the sciprt manager in place , reference the appropriate dlls ( this may not be required if you are working on ASP.net 3.0), Register the AJAXtoolkit tags on your page.

2) Drop a SliderExtender control on the page and define the necessary attributes as below

I won't be discussing the various attributes defined above but they can be found in this dictionary.

Thre interesting attribute here is BehaviorId . The BehaviorId property is used here to set the an ID value, which can be used to update the slider of the slider control dynamically depending on the calculation or any desired logic.

The TargetControlId is the id of the control which is used as the udrlying control to which the slider is bound so that the change events can be caputured. The SetValue() method is fired on the change of the slider which in turn fires the onChange() , because of the change in the value of the textbox underlying the slider as shown below.

This is about it and you can have have a control something like shown below , wherein if yoy update one value the other value gets updated by itself . Cool :) !!