Puts a slider control, for selecting a numeric value from a range, in a ColdFusion form. The slider moves over the slider groove. As the user moves the slider, the current value displays. Used within a cfform
tag.
<cfslider
name = "name"
label = "text"
refreshLabel = "Yes" or "No"
range = "min_value, max_value"
scale = "uinteger"
value = "integer"
onValidate = "script_name"
message = "text"
onError = "text"
height = "integer"
width = "integer"
vSpace = "integer"
hSpace = "integer"
align = "alignment"
tickMarkMajor = "Yes" or "No"
tickMarkMinor = "Yes" or "No"
tickMarkImages = "URL1, URL2, URLn"
tickMarkLabels = "Yes" or "No" or "list"
lookAndFeel = "motif" or "windows" or "metal"
vertical = "Yes" or "No"
bgColor = "color"
textColor = "color"
font = "font_name"
fontSize = "integer"
italic = "Yes" or "No"
bold = "Yes" or "No"
notSupported = "text">
cfapplet
,
cfinput
,
cfform
,
cfselect
,
cftextinput
,
cftree
,
cftreeitem
ColdFusion MX: Deprecated the img
, imgStyle
, and grooveColor
attributes. They might not work, and might cause an error, in later releases.
Attribute | Req/Opt | Default | Description |
---|---|---|---|
name |
Required |
|
Name of |
label |
Optional |
|
Label to display with control; for example, To reference the value, use |
refreshLabel |
Optional |
Yes |
|
range |
Optional |
"0,100" |
Numeric slider range values. Separate values with a comma. |
scale |
Optional |
|
Unsigned integer. Defines slider scale, within Signed and unsigned integers in ColdFusion are in the range -2,147,483,648 to 2,147,483,647. |
value |
Optional |
Minimum in range |
Starting slider setting. Must be within the |
onValidate |
Optional |
|
Custom JavaScript function to validate user input; in this case, a change to the default slider value. Specify only the function name. |
message |
Optional |
|
Message text to appear if validation fails. |
onError |
Optional |
|
Custom JavaScript function to execute if validation fails. Specify only the function name. |
height |
Optional |
40 |
Slider control height, in pixels. |
width |
Optional |
|
Slider control width, in pixels. |
vSpace |
Optional |
|
Vertical spacing above and below slider, in pixels. |
hSpace |
Optional |
|
Horizontal spacing to left and right of slider, in pixels. |
align |
Optional |
|
Alignment of slider
|
tickMarkMajor |
Optional |
No |
Major tick marks display at intervals specified by |
tickMarkMinor |
Optional |
No |
Minor tickmarks display between major tickmarks. |
tickMarkImages |
Optional |
|
Comma-delimited list of URLs specifying images in slider tickmark scale. If you do not specify enough values, the last value is repeated for remaining tickmarks. If you specify too many values, extra values are ignored. |
tickMarkLabels |
Optional |
No |
If you do not specify enough values, the last value is repeated for remaining tickmarks. If you specify too many values, extra values are ignored. |
lookAndFeel |
Optional |
Windows |
If platform does not support choice, the tag defaults to the platform's default style. |
vertical |
Optional |
No |
|
bgColor |
Optional |
|
Background color of slider label. For a hex value, use the form:
|
textColor |
Optional |
|
Options: same as for |
font |
Optional |
|
Font name for label text. |
fontSize |
Optional |
|
Font size for label text, in points. |
italic |
Optional |
No |
|
bold |
Optional |
No |
|
notSupported |
Optional |
|
Text to display if a page that contains a Java applet-based
Default message: <b>Browser must support Java to <br>view ColdFusion Java Applets!</b> |
This tag requires the client to download a Java applet. Using this tag may be slightly slower than using an HTML form element to display the same information.
For this tag to work properly. the browser must be JavaScript-enabled.
If the following conditions are true, a user's selection from query data that populates this tag's options continues to display after the user submits the form:
cfform
preserveData
attribute is set to "Yes
"cfform
action
attribute posts to the same page as the form itself (this is the default), or the action page has a form that contains controls with the same names as corresponding controls on the user entry formFor more information, see the cfform
tag entry.
<!--- This example shows how to use cfslider within cfform ---> <h3>cfslider Example</h3> <p>cfslider, used within a cfform, can provide functionality to Java-enabled browsers. <p>Try moving the slider back and forth to see the real-time value change. Then, submit the form to show how cfslider passes its value on to a new page. <cfif isdefined("form.mySlider") is true> <h3>You slid to a value of <cfoutput>#mySlider#</cfoutput></h3> Try again! </cfif> <cfform action = "cfslider.cfm"> <cfslider name = "mySlider" value = "12" label = "Actual Slider Value " range = "1,100" align = "BASELINE" message = "Slide the bar to get a value between 1 and 100" height = "50" width = "150" font = "Verdana" bgColor = "Silver" bold = "No" italic = "Yes" refreshLabel = "Yes"> 100 <p><input type = "Submit" name = "" value = "Show the Result"> </cfform>