cfslider

Description

Places 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 for forms in HTML and applet format. Not supported with Flash forms.

History

ColdFusion MX: Deprecated the img, imgStyle, grooveColor, refreshLabel, tickmarklabels, tickmarkmajor, tickmarkminor, and tickmarkimages attributes. They sometimes do not work, and can cause an error, in later releases.

Syntax

For HTML

<cfslider  
    name = "name" 
    clickToChange = "true|false" 
    format = "html" 
    height = "integer" 
    increment = "Unit increment value" 
    max = "maximum value for the slider" 
    min = "minimum value for the slider" 
    onChange = "JavaScript function name" 
    onDrag = "JavaScript function name" 
    tip = "true|false" 
    value = "integer" 
    vertical = "true|false" 
    width = "integer">

Attributes

Attribute	Description	Required	Default
align	Alignment of slider: top left bottom baseline texttop absbottom middle absmiddle right	Optional
bgColor	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. any color, in hexadecimal format black red blue magenta cyan orange darkgray pink gray white lightgray yellow	Optional
bold	yes: label text in bold. no: medium text.	Optional	no
clickToChange	Whether clicking the slider changes the value of the pointer:true false	Optional HTML
font	Font name for label text.	Optional
fontSize	Font size for label text, in points.	Optional
format	Specifies if the format is: html applet	Optional	applet
height	Slider control height, in pixels.	Optional	40, for applet 100, for HTML
hSpace	Horizontal spacing to left and right of slider, in pixels.	Optional
increment	The unit increment value for a snapping slider.	Optional HTML
italic	yes: label text in italics. no: normal text.	Optional	no
label	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.	Optional
lookAndFeel	motif: renders slider using Motif style. windows: renders slider using Windows style. metal: renders slider using Java Swing style. If platform does not support choice, the tag defaults to the platform’s default style.	Optional	Windows
max	Maximum value for the slider.	Optional HTML
message	Message text to appear if validation fails.	Optional Applet
min	Minimum value for the slider.	Optional HTML
name	Name of cfslider control.	Required
notSupported	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>	Optional
onChange	Custom JavaScript function to run when slider value changes. Specify only the function name.	Optional HTML
onDrag	Custom JavaScript function to run when you drag the slider. Specify only the function name.	Optional HTML
onError	Custom JavaScript function to run if validation fails. Specify only the function name.	Optional
onValidate	Custom JavaScript function to validate user input; in this case, a change to the default slider value. Specify only the function name.	Optional
range	Numeric slider range values. Separate values with a comma.	Optional	"0,100"
scale	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.	Optional
textColor	Options: same as for bgcolor attribute.	Optional
tip	Whether the data valu has to display as data tips: true false	Optional HTML	true
value	Starting slider setting. Must be within the range values.	Optional	Minimum in range
vertical	For Applet forms: yes: renders slider in browser vertically. Set width and height attributes; ColdFusion does not automatically swap width and height values. no: renders slider horizontally. For HTML forms: true: renders slider in browser vertically. Set width and height attributes; ColdFusion does not automatically swap width and height values. false: renders slider horizontally.	Optional	no(for applet forms)false(for HTML forms)
vSpace	Vertical spacing above and below slider, in pixels.	Optional
width	Slider control width, in pixels.	Optional	200, for HTML

Usage

This tag requires the client to download a Java applet. Using this tag is sometimes 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 plug-in installed, the system sometimes has to download an updated Java plug-in 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:
The cfformpreserveData attribute is set to "Yes".
The cfformaction 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 form.
For more information, see the cfform tag entry.

Example

<!--- This example shows how to use cfslider</h3> 
    <br/ > 
    <cfform name="form01"> 
    <cfslider name="slider1" 
    format="HTML" 
    vertical="false" 
    width="350" 
    value="100" 
    min="0" 
    max="200" 
    increment="10" 
    tip="true"/> 
</cfform>

cfmldocs