/

The “Range Slider” element is a visual input element that allows users to select a value within a specific range within the application.
To use this element, first create the table on the screen from the “Tables” section in the “Data Sources” module. Create the “InsertProductInventory” action from the “New SQL Action” option in the “Actions” section. Enter your table name in the format “dbo.” Test it and click the “Create” button. Next, follow the same steps to create the “GetProductsByValueRange” action. Then, use the “UI Design” module to drag and drop the “Range Slider” element onto your page. When the screen opens, set the range values to “10” and “75” in the “Start Value” and “End Value” fields. Set the minimum and maximum values within the “Range Slider” to “0” and “200” in the “Min” and “Max” fields. Set the color using the “Handle Color” and “Slider Color” fields. To view the selected range values, set the “TooltipVisible” setting to “On.” Add the “pageInit” action to the screen. In the field that opens, define the “minValue” and “maxValue” fields. Add your “GetProductsByValueRange” action to the “Range Slider” element using “onChange.” Define the fields from the action parameters. From the “Action Tree” area on the left side of the page, drag the blue icon next to the “GetProductsByValueRange” action onto the page. Select “Table” and “Outputs,” then click the “Create” button.
When the application is tested, the product list is dynamically filtered by selecting the minimum and maximum price range using the “Range Slider” at the top of the screen. The values set on the slider are updated in real time, and products that fall within this range are automatically displayed in the table. Users can quickly and easily list only the products that fit their budget or meet their search criteria by narrowing or widening the price range.