Home / Community & Support / Knowledge Base / RadControls for ASP.NET and ASP.NET AJAX / Slider / How to cancel the flip of the drag handles

How to cancel the flip of the drag handles

Article Info

Rating: Not rated

Article information

Article relates to

 RadSlider for ASP.NET AJAX 

Created by

 Svetlina, Telerik


HOW-TO: 

Cancel the flip of the RadSlider's drag handles

SOLUTION:



The RadSlider control does not offer the functionality to cancel the flip of the drag handles out of the box but you can easily achieve this by using the control's client-side API.  You can use the OnClientBeforeValueChange client-side event to achieve to cancel the operation. e.g as shown below:


  <form id="form1" runat="server">  
        <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
        <telerik:RadSlider ID="RadSlider1" runat="server" IsSelectionRangeEnabled="true" 
            SmallChange="1" SelectionStart="0" SelectionEnd="1" OnClientBeforeValueChange="OnClientBeforeValueChange">  
        </telerik:RadSlider> 
 
        <script type="text/javascript">     
        function OnClientBeforeValueChange(sender, args)     
        {     
            var minRangeBetweenHandles = sender.get_smallChange();     
            var newValue = args.get_newValue();     
                     
            var sliderDragHandles = sender.get_dragHandles();     
            var activeDragHandle = sender.get_activeHandle();     
                 
            // In case we are moving the selectionStart dragHandle.     
            if(activeDragHandle == sliderDragHandles[0])     
            {                 
                if(newValue >= (sender.get_selectionEnd() - minRangeBetweenHandles))     
                {     
                    args.set_cancel(true);     
                }     
            }     
            // In case we are moving the selectionEnd dragHandle.     
            else    
            {     
                if(newValue <= (sender.get_selectionStart() + minRangeBetweenHandles))     
                {     
                    args.set_cancel(true);     
                }     
            }     
        }     
        </script> 
 
    </form> 

You can find a sample working page in the attached archive file.

Files

Comments

There are no comments yet.
If you'd like to comment on this KB article, please, send us a Support Ticket.
Thank you!

Please Sign In to rate this article.