MultiHandleSliderExtender - DevExpress/AjaxControlToolkit GitHub Wiki
The MultiHandleSlider extender provides a feature-rich extension to a regular asp:Textbox control. It allows you to choose a single value or multiple values in a range through a graphical slider interface. It supports one handle, dual handles, or any number of handles bound to values of the asp:TextBox or asp:Label controls. It also provides options for read-only access, custom graphic styling, hover and drag handle styles, as well as the mouse and keyboard support for accessibility.
Properties
| Name | Description |
|---|---|
| BoundControlID | ID of a control to use for a single handle Remarks: Only used as a backward-compatibility feature for users that wish to upgrade their existing controls. The server control should be a TextBox or Label control |
| ClientMultiHandleSliderTargets | The list of controls used to bind slider handle values. These should be Label or TextBox controls |
| CssClass | A master style to apply to slider graphical elements |
| Decimals | The number of decimal digits in a single slider's value Remarks: 0 means an integer value. Only used as a backward-compatibility feature for users wishing to upgrade their existing controls |
| EnableHandleAnimation | Determines if the slider handles display of an animation effect when the position is changed |
| EnableInnerRangeDrag | Determines if the inner rail range can be dragged as a whole, moving both handles defining it |
| EnableKeyboard | Determines if the slider will respond to arrow keys when it has focus |
| EnableMouseWheel | Determines if the slider will respond to the mouse wheel when it has focus |
| EnableRailClick | Determines if clicking the rail will detect and move the closest handle |
| HandleAnimationDuration | Determines the total duration of an animation effect in seconds |
| HandleCssClass | A CSS class of a single handle Remarks: Only used as a backward-compatibility feature for users wishing to upgrade their existing controls |
| HandleImageUrl | URL for an image to display in the slider's handle Remarks: Only used as a backward-compatibility feature for users wishing to upgrade their existing controls |
| Increment | Determines the number of slider points to increment or decrement using the keyboard or mouse wheel. It is ignored if the steps property is used |
| InnerRailStyle | Determines how the inner rail style is handled |
| IsReadOnly | Determines if the slider and its values can be manipulated |
| IsServerControl | Determines if a control is server-side |
| Length | The slider rail length in pixels |
| Maximum | The highest value on the slider |
| Minimum | The lowest value on the slider |
| MultiHandleSliderTargets | The list of controls used to bind slider handle values. These should be Label or TextBox controls |
| OnClientDrag | An event raised when a user drags the slider |
| OnClientDragEnd | An event raised when a user drops the slider |
| OnClientDragStart | An event raised when a user initiates the drag operation on the slider |
| OnClientLoad | An event raised when the slider is completely loaded on the page |
| OnClientValueChanged | An event raised when the slider changes its state |
| Orientation | Determines if the slider's orientation is horizontal or vertical |
| RailCssClass | A CSS class for the slider's rail element Remarks: Only used as a backward-compatibility feature for users wishing to upgrade their existing controls |
| RaiseChangeOnlyOnMouseUp | Determines if changes events to the slider's values are raised during dragging. Otherwise, they are raised when dragging is completed |
| ShowHandleDragStyle | Determines if the slider handles will show a style effect when they are being dragged |
| ShowHandleHoverStyle | Determines if the slider handles will show a style effect when they are hovered over |
| ShowInnerRail | Determines if the slider will show an inner selected range rail. Otherwise, it will be displayed as a uniform rail |
| Steps | Determines the number of discrete locations on the slider. Otherwise, the slider is continous |
| TooltipText | Determines text to display as a tooltip; {0} denotes the current handle's value in the format string |
Client properties
| Name | Description |
|---|---|
| boundControlID | ID of a control to use for a single handle |
| cssClass | A master style to apply to slider graphical elements |
| decimals | The number of decimal digits in a single slider's value |
| enableHandleAnimation | Determines if the slider handles display an animation effect when the position is changed |
| enableInnerRangeDrag | Determines if the inner rail range can be dragged as a whole moving both handles defining it |
| enableKeyboard | Determines if the slider will respond to arrow keys when it has focus |
| enableMouseWheel | Determines if the slider will respond to the mouse wheel when it has focus |
| enableRailClick | Determines if clicking the rail will detect and move the closest handle |
| handleAnimationDuration | Determines the total duration of the animation effect in seconds |
| handleCssClass | A CSS class of a single handle |
| handleImageUrl | URL for an image to display in the slider's handle |
| increment | Determines the number of slider points to increment or decrement using the keyboard or mouse wheel. It is ignored if the steps property is used |
| innerRailStyle | Determines how the inner rail style is handled |
| isReadOnly | Determines if the slider and its values can be manipulated |
| length | The slider rail length in pixels |
| maximum | The highest value on the slider |
| minimum | The lowest value on the slider |
| multiHandleSliderTargets | The list of controls used to bind slider handle values. These should be Label or TextBox controls |
| orientation | Determines if the slider's orientation is horizontal or vertical |
| railCssClass | A CSS class for the slider's rail element |
| raiseChangeOnlyOnMouseUp | Determines if changes events to the slider's values are raised during dragging. Otherwise, they are raised when dragging is completed |
| showHandleDragStyle | Determines if the slider handles will show a style effect when they are being dragged |
| showHandleHoverStyle | Determines if the slider handles will show a style effect when they are hovered over |
| showInnerRail | Determines if the slider will show an inner selected range rail. Otherwise, it will be displayed as a uniform rail |
| sliderInitialized | Determines whether or not this slider is initialized |
| steps | Determines the number of discrete locations on the slider. Otherwise, the slider is continous |
| tooltipText | Determines the text to display as a tooltip; {0} denotes the current handle's value in the format string |
| value | A value of a single bound control for backward compatibility of the existing slider and tests. Can be used only in this context |
| values | A list of all handle values as a comma-delimited string |
Client methods
| Name | Description |
|---|---|
| getValue(index) | Returns a value of a specific slider handle programmatically by index |
| onDrag() | Raises the OnDrag event |
| onDragEnd() | Raises the OnDragEnd event |
| onDragStart() | Raises the OnDragStart event |
| setValue(index, value) | Sets a value of a specific slider handle programmatically by index |
Client events
| Name | Description |
|---|---|
| drag | The event is raised when the user drags the slider |
| dragEnd | The event is raised when the user drops the slider |
| dragStart | The event is raised when a user initiates the drag operation on the slider |
| load | The event is raised when the slider is completely loaded on the page |
| valueChanged | The event is raised when the slider changes its state |
Client properties
boundControlID
ID of a control to use for a single handle
Getter name: get_boundControlID()Setter name: set_boundControlID(value)
cssClass
A master style to apply to slider graphical elements
Getter name: get_cssClass()Setter name: set_cssClass(value)
decimals
The number of decimal digits in a single slider's value
Getter name: get_decimals()Setter name: set_decimals(value)
enableHandleAnimation
Determines if the slider handles display an animation effect when the position is changed
Getter name: get_enableHandleAnimation()Setter name: set_enableHandleAnimation(value)
enableInnerRangeDrag
Determines if the inner rail range can be dragged as a whole moving both handles defining it
Getter name: get_enableInnerRangeDrag()Setter name: set_enableInnerRangeDrag(value)
enableKeyboard
Determines if the slider will respond to arrow keys when it has focus
Getter name: get_enableKeyboard()Setter name: set_enableKeyboard(value)
enableMouseWheel
Determines if the slider will respond to the mouse wheel when it has focus
Getter name: get_enableMouseWheel()Setter name: set_enableMouseWheel(value)
enableRailClick
Determines if clicking the rail will detect and move the closest handle
Getter name: get_enableRailClick()Setter name: set_enableRailClick(value)
handleAnimationDuration
Determines the total duration of the animation effect in seconds
Getter name: get_handleAnimationDuration()Setter name: set_handleAnimationDuration(value)
handleCssClass
A CSS class of a single handle
Getter name: get_handleCssClass()Setter name: set_handleCssClass(value)
handleImageUrl
URL for an image to display in the slider's handle
Getter name: get_handleImageUrl()Setter name: set_handleImageUrl(value)
increment
Determines the number of slider points to increment or decrement using the keyboard or mouse wheel. It is ignored if the steps property is used
Getter name: get_increment()Setter name: set_increment(value)
innerRailStyle
Determines how the inner rail style is handled
Getter name: get_innerRailStyle()Setter name: set_innerRailStyle(value)
isReadOnly
Determines if the slider and its values can be manipulated
Getter name: get_isReadOnly()Setter name: set_isReadOnly(value)
length
The slider rail length in pixels
Getter name: get_length()Setter name: set_length(value)
maximum
The highest value on the slider
Getter name: get_maximum()Setter name: set_maximum(value)
minimum
The lowest value on the slider
Getter name: get_minimum()Setter name: set_minimum(value)
multiHandleSliderTargets
The list of controls used to bind slider handle values. These should be Label or TextBox controls
Getter name: get_multiHandleSliderTargets()Setter name: set_multiHandleSliderTargets(value)
orientation
Determines if the slider's orientation is horizontal or vertical
Getter name: get_orientation()Setter name: set_orientation(value)
railCssClass
A CSS class for the slider's rail element
Getter name: get_railCssClass()Setter name: set_railCssClass(value)
raiseChangeOnlyOnMouseUp
Determines if changes events to the slider's values are raised during dragging. Otherwise, they are raised when dragging is completed
Getter name: get_raiseChangeOnlyOnMouseUp()Setter name: set_raiseChangeOnlyOnMouseUp(value)
showHandleDragStyle
Determines if the slider handles will show a style effect when they are being dragged
Getter name: get_showHandleDragStyle()Setter name: set_showHandleDragStyle(value)
showHandleHoverStyle
Determines if the slider handles will show a style effect when they are hovered over
Getter name: get_showHandleHoverStyle()Setter name: set_showHandleHoverStyle(value)
showInnerRail
Determines if the slider will show an inner selected range rail. Otherwise, it will be displayed as a uniform rail
Getter name: get_showInnerRail()Setter name: set_showInnerRail(value)
sliderInitialized
Determines whether or not this slider is initialized
Remarks: For backward compatibility with the original slider
Getter name: get_sliderInitialized()
steps
Determines the number of discrete locations on the slider. Otherwise, the slider is continous
Getter name: get_steps()Setter name: set_steps(value)
tooltipText
Determines the text to display as a tooltip; {0} denotes the current handle's value in the format string
Getter name: get_tooltipText()Setter name: set_tooltipText(value)
value
A value of a single bound control for backward compatibility of the existing slider and tests. Can be used only in this context
Getter name: get_value()Setter name: set_value(value)
values
A list of all handle values as a comma-delimited string
Remarks: This is required for automated toolkit test behavior. Returns a comma-delimited string of handle values
Getter name: get_values()
Client methods
getValue(index)
Returns a value of a specific slider handle programmatically by index
Params:
- index
- Type: Number
- Description: Handle index
onDrag()
Raises the OnDrag event
onDragEnd()
Raises the OnDragEnd event
onDragStart()
Raises the OnDragStart event
setValue(index, value)
Sets a value of a specific slider handle programmatically by index
Params:
-
index
- Type: Number
- Description: Handle index
-
value
- Type: Number
- Description: Value
Client events
drag
The event is raised when the user drags the slider
Add event handler method: add_drag(handler)Remove event handler method: remove_drag(handler)
dragEnd
The event is raised when the user drops the slider
Add event handler method: add_dragEnd(handler)Remove event handler method: remove_dragEnd(handler)
dragStart
The event is raised when a user initiates the drag operation on the slider
Add event handler method: add_dragStart(handler)Remove event handler method: remove_dragStart(handler)
load
The event is raised when the slider is completely loaded on the page
Add event handler method: add_load(handler)Remove event handler method: remove_load(handler)
valueChanged
The event is raised when the slider changes its state
Add event handler method: add_valueChanged(handler)Remove event handler method: remove_valueChanged(handler)