Grid Filtering
Filter grid using parent controls
Id | Person | Food | Country | Date | Location | Chef |
3675 | Mary | Shepherd's pie | La Croisette | 11/19/2022 | Diner | Pepper Tomato |
3671 | Jeremy | Pizza | Regent | 6/13/2010 | Tavern | Demeter Harvest |
3667 | John | Cheesecake | Winterspring | 9/25/2015 | Restaurant | Josh Baskin |
3663 | Michael | Hot Beverage | Jisina | 2/13/2012 | Visit | Pepper Tomato |
3659 | Gabrielle | French toast | Goldshire | 5/19/2016 | Tavern | Omu Man |
3655 | Lucy | Big Salad | Stormwind | 4/3/2019 | Tavern | Omu Man |
3651 | Cheyenne | Big Salad | Westfall | 11/1/2017 | Visit | Omu Man |
3647 | Jonah | Shepherd's pie | Sylvanaar | 4/27/2020 | Visit | Joanna Stan |
3643 | Fernando | Soup | Ghidrimesti | 5/7/2010 | University | Chef Chef |
3639 | Audrey | Shepherd's pie | Piccadilly | 5/17/2011 | University | Charles Duchemin |
The grid can be filtered by adding parent controls to it, when a parent control triggers the
change
event,
the grid (child) will reload and the parent values will be sent as parameters to the data function (or url in this case).
Grid filtering using a popup to enter the search criteria
Id | Person | Food | Country | Date | Location | Chef |
3675 | Mary | Shepherd's pie | La Croisette | 11/19/2022 | Diner | Pepper Tomato |
3671 | Jeremy | Pizza | Regent | 6/13/2010 | Tavern | Demeter Harvest |
3667 | John | Cheesecake | Winterspring | 9/25/2015 | Restaurant | Josh Baskin |
3663 | Michael | Hot Beverage | Jisina | 2/13/2012 | Visit | Pepper Tomato |
3659 | Gabrielle | French toast | Goldshire | 5/19/2016 | Tavern | Omu Man |
3655 | Lucy | Big Salad | Stormwind | 4/3/2019 | Tavern | Omu Man |
3651 | Cheyenne | Big Salad | Westfall | 11/1/2017 | Visit | Omu Man |
3647 | Jonah | Shepherd's pie | Sylvanaar | 4/27/2020 | Visit | Joanna Stan |
3643 | Fernando | Soup | Ghidrimesti | 5/7/2010 | University | Chef Chef |
3639 | Audrey | Shepherd's pie | Piccadilly | 5/17/2011 | University | Charles Duchemin |
show code
Filter by all columns
Id | Person | Food | Location | Date | Country | Chef |
1475 | Scott | Banana | University | 11/15/2013 | Farringdon | Charles Duchemin |
1471 | Kelly | Big Salad | Restaurant | 8/11/2021 | Hatton Garden | Tom Smykowski |
1467 | Hugo | Pizza | Tavern | 3/11/2014 | Redridge Mountains | Fromage Sandwich |
1463 | Stan | Cheesecake | Tavern | 5/27/2014 | Westfall | Demeter Harvest |
1459 | Mario | Big Salad | Home | 3/27/2021 | Goldshire | Bruce Nolan |
1455 | Alice | Soup | University | 9/21/2016 | Ghidrimesti | Tom Smykowski |
1451 | Rachel | Soup | Tavern | 5/19/2009 | Jisina | Hercules Oat |
1447 | Lucy | Shepherd's pie | Home | 5/15/2018 | Carpana | Pepper Tomato |
1443 | Maurice | Pizza | Central Perk | 5/5/2009 | Orgrimmar | Josh Baskin |
1439 | Patrick | Apple Pie | Tavern | 11/19/2017 | Feralas | Chef Chef |
show code
Grid outside filter row and custom render
Id | Name | Chef | Date | Meals | Organic |
4315 | cabbage | Naked Chef | 1/6/2025 | Mango, Apple | Yes |
675 | asdasda | Gaia Earth | 6/8/2007 | Rice | No |
673 | Apples | Peter Gibbons | 9/17/2018 | Broccoli, Mango | No |
671 | Cookies | Joanna Stan | 11/13/2019 | Tomato, Walnuts, Cauliflower | Yes |
669 | Morning Tea | Pepper Tomato | 6/15/2009 | Hazelnuts | No |
667 | Morning meal | Pepper Tomato | 8/11/2018 | Walnuts | Yes |
665 | Snacks and movie | Joanna Stan | 10/9/2020 | Buckwheat | No |
663 | Apero | Gaia Earth | 10/27/2010 | Almonds, Buckwheat, Apple | Yes |
661 | petit dej | Joanna Stan | 8/3/2009 | Walnuts, Buckwheat | Yes |
659 | Breakfast | Casse Croute | 10/27/2012 | Mango | Yes |
Reusing the same data source (url) as for the Grid with filter row (server side data), except in this demo we're using the controls outside of the grid to filter the demo.
Just like in the filter row demos the filter controls get their data from the grid model.
Additionally there is filter persistence, so after page refresh the grid will have the same filters applied.
And there's a custom item render mod applied so you can switch between cards view and rows.
Just like in the filter row demos the filter controls get their data from the grid model.
Additionally there is filter persistence, so after page refresh the grid will have the same filters applied.
And there's a custom item render mod applied so you can switch between cards view and rows.
Comments