Скачать или смотреть How to Sync a Range Slider with Input Fields | Custom Form Builder

This tutorial explains how to configure a Range Slider question in SurveyJS and sync it with two input fields. When the Range Slider and input fields are synchronized, they update each other's values in real time. For example, dragging the slider thumbs updates the values in the input fields, and typing in the input fields adjusts the slider positions.

00:00 Introduction
00:51 Add a Range Slider question
01:19 Configure Range Settings
03:43 Set default values for the Range Slider
04:56 Add Single-Line Inputs for manual data entry
06:36 Update values in real time
06:52 Synchronize the Range Slider values with the corresponding input fields
08:14 Sync a Single-Value Slider with a Single-Line Input

🔗Build a form in Survey Creator demo for free: https://surveyjs.io/create-free-survey
🔗Dual Range Slider demo: https://surveyjs.io/form-library/exam...

________________________________

SurveyJS develops and supports client-side JavaScript form libraries that can integrate with any server or database of your choice. The libraries are compatible with Angular, React, Vue3, and vanilla JS, allowing you to fully control your backend and data. They work seamlessly with any backend logic you develop. This setup ensures you have full control over your data, user management, and server-side code, without any limitations from SurveyJS.

The library suite includes:

• Survey Creator: A customizable client-side form editor for building surveys and forms. It automatically generates form definitions (schemas) in JSON format, describing the form’s style, content, layout, and behavior.

• Form Library: A free MIT-licensed UI component that parses a SurveyJS form JSON defining a form and dynamically generates the corresponding HTML elements to render the form on a web page.

• PDF Generator: A UI component that uses a SurveyJS form JSON schema to render a form as a PDF in a browser. To populate PDF fields with responses, the library pulls data collected by Form Library.

• Dashboards: A UI component for visualizing survey data through charts and tables, based on the input types used to collect it. It works with a SurveyJS form JSON to understand data types for visualization and uses user responses to populate the dashboard with relevant survey data.

🔗Website: https://surveyjs.io/
🔗Source code: https://github.com/surveyjs
🔗Learn more about backend integration: https://surveyjs.io/documentation/bac...