Slider message

Description

The "Slider message" property specifies the message that should be shown when the user is dragging on the slider. The message can use HTML markup. You can use placeholders in the template to indicate the value of the slider. You can also specify a Javascript function to compute the message text.

Add a message to a simple slider.

  1. In the UX Builders design tab open the UX Controls page. Under the Data Controls dropdown click on the [Slider] option.

    images/message.png
  2. The New Control dialog will open. Name the Slider and click OK to add the Slider control to the component

    images/message2.png
  3. Highlight the control. The control's properties will appear on the right side of the control page. Scroll down to the Slider Properties.

    images/message3.png
  4. Set the "Slider data type" dropdown property to "number" and check the Show handle property.

    images/message4.png
  5. Check the Show slider message property.

    images/message5.png
  6. Click the button next to the Slider message property.

    images/message6.png
  7. The Slider Message dialog will open. In the "Available Placeholders:" list double click on the {value} placeholder to add it to the html work area.

    images/message7.png
  8. Click OK to close the Slider Message dialog. Run the slider control in the Live Preview tab. Move the slider handle to change the message.

    images/message8.png