In this chapter, we’ll look at how to sort information on a filter with the Select element.

With this feature, you can choose a specific database field to use to sort information. This allows you to do cool things like add a number field to a database and manually order content.

How to use the Select element

First, make sure you have a Filter form that’s set up properly with a Select element. If you’re not sure how that’s done, check out our dynamic filter and search documentation. 

Alternatively, you can follow the tutorial below and use the Marketplace template.

Now that you’re in the editor, click on the Select element (in the Layers sidebar or Canvas). Head to the right side of the screen and click Settings.

Now open the dropdown next to Options and choose the database that you’d like to use for the filter. For us, that database is named “Field”.

Now under Options, you’ll see a new setting named Sort by. Here you can select a specific field to sort the content on the database by. 

Let’s say you want to manually choose the order of the content. 

Open the Database section from the menu on the left and select the database you’re using on the Select element (for us it’s “Field”). Then create a new Number field and name it “Order”. 

You can now manually update each row and add numbers to each number field to order rows accordingly.

Once that’s all set up, go back to the canvas.

Click on the Select element and open Settings on the right. Under Get options for and then next to Sort by, select the field we just created (“Order”).

If we now preview the page, you’ll see that the content order on the select element is exactly according to what you manually input in the database number field.