DMXzone Slider Manual

Advanced: Using DMXzone Slider to Filter Ajax Datagrid

In this tutorial we will show you how to use DMXzone Slider in order to filter Ajax Datagrid.

*You can also check out the video.

How to do it

1. We've already inserted our Ajax Datagrid on our page and we're going to use DMXzone Slider to filter it by the price column.

2. In a separate container we will insert the DMXzone Slider so open the DMXzone Slider window.

3. In the DMXzone Slider window we set 200 as a minimal value and 800 as a maximal value (1), also in the range options we check the fixed maximum (2) and use 200 as an initial max value (3).
   
   

4. Now we're going to connect the DMXzone Slider with the Ajax Datagrid through the Behavior connector. Click the Add/edit behaviors button.
   
   

5. From the DMXzone folder (1), choose Control Ajax Datagrid behavior (2), select the When handle is dragged action (3) and add the selected behavior (4).

6. In the Control Ajax Datagrid window select the Ajax Datagrid ID (1) from the Grid ID menu and add the Set grid filter item (2) from the select action dropdown menu.

7. We're going to use the Price column in our Ajax Datagrid (1) with < item as a condition (2), entered value as value (3) and ##value## as a mask (4) that returns the current value of the handle.

8. Now you can save your work and preview the result in the browser.