Tuesday 10 October 2017

DropList Filter

How to create Filter by variable value in Droplist

Step - 1 - First Place Repeater and form the table with Name,Image,Price,Description


Step - 2 - Edit the repeater cell


Step - 3 - Place the box and name it as per repeater table column name / header - Name, image,Price,Description


Step - 4 - Add case to the repeater, click on exiting case and add more actions like - Click to  add action -widgets - Set Text  . In configuration action -> checked the description.
Then click on bottom fx


Step - 5 - While clicked on fx it will open "Edit Text" -> From dropdown Select -> Item.Description and click OK


Follow the same step to Price also.


Step - 6 - For Image -> Need to select ->

add action -widgets - Set Image,   In configuration action -> checked the Set Image

Below select Value and click on fx.


Step - 7 - While clicking fx it will open Edit text , here select Item.Image and click OK.


Step - 8 - Now go back to Repeater and arrange all boxes in a box  


Step - 9 - Make  Repeater interactive so in Style tab check the Layout 


Step - 10 - DropList Filter -> Place the Droplist in canvas name it, and add List of item


Step - 11 -  Select the DropList , In Properties -> click on "OnSelectionChange" In case editor add Condition


Step - 12 - In case Editor need to change only 3rd column as "does not equal" 


Step - 13 - Click to add action -> Repeaters -> Add Filter

In Configure action -> Checked Product 

Unchecked -> Remove other Filter

Name - Filter_Product

Rule click "fx"



Step - 14 - after clicking on fx - > Edit value window will open -> Add Local Variable in middle column - dropdown select - selected option of .

in top write -> [[ Item.Name == LVAR1]]

Here Name is the column name where all product is kept like icon,wallpaper,pattern.


Step -15 - Now Remove Filter -> in Click to add action   -> Repeater -> Remove filter

In Configure action -> Checked Product

In Bottom -> Name -> Filter_product and click OK


Step - 16 - Preview 



Thanks .

No comments:

Post a Comment