top of page
Dynamically Sort a Repeater
Allow users to dynamically sort repeater data in ascending or descending order with a radio button using Corvid (a.k.a. Wix Code).
You can dynamically sort a table or repeater in ascending or descending order based on any field available in your collection. This example will show you how to sort a table displaying data from a #dbEmployee database by the last name or descending hourly rate based on a radio button selection. You can try it below.
Try it!
#radioSort
First Name | Last Name | Position | Hourly Rate |
|---|---|---|---|
Jane | Austen | Logistics Coordinator | 16.68 |
Jenny | Cruz | Sales Assistant | 17.5 |
Joy | Dunner | Sales Assistant | 15.75 |
Josie | Fay | Junior Accountant | 19.99 |
Jim | Fraser | Accountant | 22.25 |
Judith | Jane | Senior Accountant | 24 |
Jeff | McGowan | Sales Manager | 23.5 |
James | Norris | Sales Assistant | 13.5 |
Jim | Smith | Accountant | 21.32 |
John | Smith | Sales Manager | 19.88 |
Mark | Twain | Operations Manager | 21.45 |
Johnny | Walker | Junior Accountant | 19.05 |
Julie | Walsh | Sales Assistant | 16.25 |
Janine | Wayne | Logistics Coordinator | 18.5 |
Jack | Wilde | Sales Assistant | 12.45 |
The first step is to add a radio button (or whatever user input field you'd like) to toggle the new sort. An onChange event listener is added to the radio (called radioSort_change in this example). Thereafter, add the following sort code to the listener function in the page code.
Page Code
Please wait ...
Disclaimer: To the best of our knowledge, this code works for its stipulated purpose. If you find an error in our code, or know of a better way to achieve the same result - please contact us! All our code snippets come with full support to help you implement them on your own website - simply contact us for help.
bottom of page