-
Notifications
You must be signed in to change notification settings - Fork 139
MultiHandleSlider
MultiHandleSliderExtender (demo)
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.
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 |
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 |
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 |
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 |
Determines whether or not this slider is initialized
Remarks: For backward compatibility with the original slider
Getter name: get_sliderInitialized()
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()
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)
The lowest value on the slider
Getter name: get_minimum()
Setter name: set_minimum(value)
The highest value on the slider
Getter name: get_maximum()
Setter name: set_maximum(value)
The slider rail length in pixels
Getter name: get_length()
Setter name: set_length(value)
Determines the number of discrete locations on the slider. Otherwise, the slider is continous
Getter name: get_steps()
Setter name: set_steps(value)
Determines if the slider's orientation is horizontal or vertical
Getter name: get_orientation()
Setter name: set_orientation(value)
Determines if the slider handles display an animation effect when the position is changed
Getter name: get_enableHandleAnimation()
Setter name: set_enableHandleAnimation(value)
Determines the total duration of the animation effect in seconds
Getter name: get_handleAnimationDuration()
Setter name: set_handleAnimationDuration(value)
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)
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)
Determines if the slider handles will show a style effect when they are hovered over
Getter name: get_showHandleHoverStyle()
Setter name: set_showHandleHoverStyle(value)
Determines if the slider handles will show a style effect when they are being dragged
Getter name: get_showHandleDragStyle()
Setter name: set_showHandleDragStyle(value)
Determines how the inner rail style is handled
Getter name: get_innerRailStyle()
Setter name: set_innerRailStyle(value)
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)
Determines if clicking the rail will detect and move the closest handle
Getter name: get_enableRailClick()
Setter name: set_enableRailClick(value)
Determines if the slider and its values can be manipulated
Getter name: get_isReadOnly()
Setter name: set_isReadOnly(value)
Determines if the slider will respond to arrow keys when it has focus
Getter name: get_enableKeyboard()
Setter name: set_enableKeyboard(value)
Determines if the slider will respond to the mouse wheel when it has focus
Getter name: get_enableMouseWheel()
Setter name: set_enableMouseWheel(value)
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)
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)
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)
A master style to apply to slider graphical elements
Getter name: get_cssClass()
Setter name: set_cssClass(value)
ID of a control to use for a single handle
Getter name: get_boundControlID()
Setter name: set_boundControlID(value)
A CSS class of a single handle
Getter name: get_handleCssClass()
Setter name: set_handleCssClass(value)
URL for an image to display in the slider's handle
Getter name: get_handleImageUrl()
Setter name: set_handleImageUrl(value)
A CSS class for the slider's rail element
Getter name: get_railCssClass()
Setter name: set_railCssClass(value)
The number of decimal digits in a single slider's value
Getter name: get_decimals()
Setter name: set_decimals(value)
Returns a value of a specific slider handle programmatically by index
Params:
-
index
- Type: Number
- Description: Handle index
Sets a value of a specific slider handle programmatically by index
Params:
-
index
- Type: Number
- Description: Handle index
-
value
- Type: Number
- Description: Value
Raises the OnDragStart event
Raises the OnDrag event
Raises the OnDragEnd event
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)
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)
The event is raised when the user drags the slider
Add event handler method: add_drag(handler)
Remove event handler method: remove_drag(handler)
The event is raised when the user drops the slider
Add event handler method: add_dragEnd(handler)
Remove event handler method: remove_dragEnd(handler)
The event is raised when the slider changes its state
Add event handler method: add_valueChanged(handler)
Remove event handler method: remove_valueChanged(handler)
This content was moved from https://ajaxcontroltoolkit.codeplex.com/documentation to this Documentation wiki. This is now the authoritative location of the AJAX Control Toolkit documentation.
- Step-by-Step Installation Guide
- Upgrading from v7.x and below
- Uninstalling the AJAX Control Toolkit
- Troubleshooting Installer Issues
- Updating the Project from CI Builds
- How to Use Bundling and CDN
- Creating a Custom Localization
- Creating a Custom Control
- Design Standards
Controls:
- Accordion
- AjaxFileUpload
- AreaChart
- AsyncFileUpload
- BarChart
- BubbleChart
- ComboBox
- Editor (deprecated)
- Gravatar
- LineChart
- NoBot
- PieChart
- Rating
- ReorderList
- Seadragon
- TabContainer
- TabPanel
Extenders:
- AlwaysVisibleControl
- Animation
- AutoComplete
- BalloonPopup
- Calendar
- CascadingDropDown
- CollapsiblePanel
- ColorPicker
- ConfirmButton
- DragPanel
- DropDown
- DropShadow
- DynamicPopulate
- FilteredTextBox
- HoverMenu
- HtmlEditor
- ListSearch
- MaskedEdit
- MaskedEditValidator
- ModalPopup
- MultiHandleSlider
- MutuallyExclusiveCheckBox
- NumericUpDown
- PagingBulletedList
- PasswordStrength
- PopupControl
- ResizableControl
- RoundedCorners
- Slider
- SlideShow
- TextBoxWatermark
- ToggleButton
- UpdatePanelAnimation
- ValidatorCallout