cfslider

Search

FORMAT="applet" HAS BEEN DEPRECATED

For a full list of deprecated features, refer to Deprecated features.

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. In HTML forms, you can create visually rich sliders that let you modify adjustable values in fixed increments. You can specify maximum, minimum, and increment values, to help you quickly filter complex results. The sliders are categorized based on the slider control. The available slider controls are:

  • Vertical The slider has vertical controls that can be adjusted to the top or bottom.
  • Horizontal The slider has horizontal controls that can be adjusted to the left or right.
  • Tip The slider displays the values as data tips.
  • Snapping The slider moves in incremental values.

Category

Forms tags

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">

Syntax

For Applet

<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">
Note:

You can specify this tag's attributes in an attributeCollection attribute whose value is a structure. Specify the structure name in the attributeCollection attribute and use the tag's attribute names as structure keys.

See also

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 Developing ColdFusion Applications

History

ColdFusion 11:

Removed the attributes -  img , imgStyle, grooveColor, refreshLabel , tickmarkimages , tickmarklabels , tickmarkmajor , and  tickmarkminor .

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.

Attributes

Attribute

Req/Opt

Default

Description

name

Required

 

Name of cfslider control.

align

Optional

 

Alignment of slider:

  • top
  • left
  • bottom
  • baseline
  • texttop
  • absbottom
  • middle
  • absmiddle
  • right

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.

  • any color, in hexadecimal format
  • black
  • red
  • blue
  • magenta
  • cyan
  • orange
  • darkgray
  • pink
  • gray
  • white
  • lightgray
  • yellow

bold

Optional

no
  • yes: label text in bold.
  • no: medium text.

clickToChange

OptionalHTML

 

Whether clicking the slider changes the value of the pointer:

  • true
  • false

font

Optional

 

Font name for label text.

fontSize

Optional

 

Font size for label text, in points.

format

Optional

applet

Specifies if the format is:

  • html
  • applet

height

Optional

40, for applet 100, for HTML

Slider control height, in pixels.

hSpace

Optional

 

Horizontal spacing to left and right of slider, in pixels.

italic

Optional

no
  • yes: label text in italics.
  • no: normal text.

increment

OptionalHTML

 

The unit increment value for a snapping slider.

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
  • 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.

max

OptionalHTML

 

Maximum value for the slider.

min

OptionalHTML

 

Minimum value for the slider.

message

OptionalApplet

 

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>

onChange

OptionalHTML

 

Custom JavaScript function to run when slider value changes. Specify only the function name.

onDrag

OptionalHTML

 

Custom JavaScript function to run when you drag the slider. Specify only the function name.

onError

Optional

 

Custom JavaScript function to run 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.

tip

OptionalHTML

true

Whether the data valu has to display as data tips:

  • true
  • false

value

Optional

Minimum in range

Starting slider setting. Must be within the range values.

vertical

Optional

no(for applet forms) false(for HTML forms)

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.

vSpace

Optional

 

Vertical spacing above and below slider, in pixels.

width

Optional

200, for HTML

Slider control width, in pixels.

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 cfform preserveData attribute is set to "Yes".
  • The 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 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>
Adobe logo

Sign in to your account

Quick links

View all your plans Manage your plans

Legal Notices    |    Online Privacy Policy