I tried creating a small ASP.Net Ajax Slider Control using JavaScript and AJAX. The idea is to generate the PostBack at some predefined intervals in the marker scale. I don’t wish to raise the PostBack for every pixel the slider slides. It will actually spoil the usability of the control than helping.
Controls used
SliderBase : A panel which contains all the following controls.
SliderHolder : It is the slider rail where the slider bar slides in.
SliderPanel : It is the slider bar.
Marker : The marker scale sitting just above the slider holder.
SliderValue : A hidden field to contain the slider value.
IsDragStarted : A hidden field to contain the state of the drag started or finished.
JavaScript and AJAX
Since most of the portion of the work is in JavaScript, I will explain this portion first and move to the server along with PostBack later. And before start developing, I have already decided to enable Ajax for this control. I don’t think it will work as expected without Ajax, so I even tried running without Ajax. Because of this reason the code is not tested for that case.
Events
Actually we are going to disable the default drag and selection using the return false for the respective functions onselectstart, and onbegindrag. Apart from disabling the events onmousedown is used to mark the drag is started using a hidden field IsDragStarted. Likewise the onmouseup event is used to mark the drag is stopped or released.
Read more with working source code here(Asp.Net Ajax Slider Control)
Tuesday, April 20, 2010
Subscribe to:
Post Comments (Atom)
0 comments:
Post a Comment