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. Not supported with Flash forms.
<cfslider name = "name
" align = "top|left|bottom|baseline|texttop|absbottom| middle|absmiddle|right" bgColor = "color
" bold = "yes|no" font = "font name
" fontSize = "integer
" height = "integer
" hSpace = "integer
" italic = "yes|no" label = "text
" lookAndFeel = "motif|windows|metal" message = "text
" notSupported = "text
" onError = "text
" onValidate = "script name
" range = "minimum value
,maximum value
" scale = "integer
" textColor = "color
" value = "integer
" vertical = "yes|no" vSpace = "integer
" width = "integer
">
cfapplet, cfcalendar, cfform, cfformgroup, cfformitem, cfgrid, cfinput, cfselect, cftextarea, cftree; "Introduction to Retrieving and Formatting Data" and "Building Dynamic Forms with cfform Tags" in the ColdFusion Developer's Guide
ColdFusion MX: Deprecated the img, imgStyle, grooveColor, refreshLabel, tickmarklabels, tickmarkmajor, tickmarkminor, and tickmarkimages attributes. They might not work, and might cause an error, in later releases.
Attribute |
Req/Opt |
Default |
Description |
---|---|---|---|
name |
Required |
|
Name of cfslider control. |
align |
Optional |
|
Alignment of slider:
|
bgColor |
Optional |
|
Background color of slider label. For a hexadecimal value, use the form: bgColor = "##xxxxxx", where x = 0-9 or A-F; use two number signs or none.
|
bold |
Optional |
no |
|
font |
Optional |
|
Font name for label text. |
fontSize |
Optional |
|
Font size for label text, in points. |
height |
Optional |
40 |
Slider control height, in pixels. |
hSpace |
Optional |
|
Horizontal spacing to left and right of slider, in pixels. |
italic |
Optional |
no |
|
label |
Optional |
|
Label to display with control; for example, "Volume" This displays: "Volume %value%" To reference the value, use "%value%". If %% is omitted, slider value displays directly after label. |
lookAndFeel |
Optional |
Windows |
If platform does not support choice, the tag defaults to the platform's default style. |
message |
Optional |
|
Message text to appear if validation fails. |
notSupported |
Optional |
|
Text to display if a page that contains a Java applet-based cfform control is opened by a browser that does not support Java or has Java support disabled. For example: "<b> Browser must support Java to view ColdFusion Java Applets</b>" Default message: <b>Browser must support Java to <br>view ColdFusion Java Applets!</b> |
onError |
Optional |
|
Custom JavaScript function to execute if validation fails. Specify only the function name. |
onValidate |
Optional |
|
Custom JavaScript function to validate user input; in this case, a change to the default slider value. Specify only the function name. |
range |
Optional |
"0,100" |
Numeric slider range values. Separate values with a comma. |
scale |
Optional |
|
Unsigned integer. Defines slider scale, within range. For example, if range = "0,1000" and scale = "100", the display values are: 0, 100, 200, 300, ... Signed and unsigned integers in ColdFusion are in the range -2,147,483,648 to 2,147,483,647. |
textColor |
Optional |
|
Options: same as for bgcolor attribute. |
value |
Optional |
Minimum in range |
Starting slider setting. Must be within the range values. |
vertical |
Optional |
no |
|
vSpace |
Optional |
|
Vertical spacing above and below slider, in pixels. |
width |
Optional |
|
Slider control width, in pixels. |
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. Also, if the client does not have an up-to-date Java plugin installed, the system might also have to download an updated Java plugin to display the tag.
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:
For 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.</p> <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"></p> </cfform>