Sorting a simple list

[neitham]

I have a list of articles I want to sort based on some criteria such as Title (A-Z), Date (Recently Added), Ratings, and Random.

This criteria should be in a Select Menu. When I click on the Select Menu dropdown, it should show:

Title
Date
Ratings
Random

I tried doing this in the sort and filter options of Simple List, but resultant is not the way I wanted as described above.

How do I do this? Any ideas?

[Yongki]

Hi @neitham ,

Currently, sorting is not configurable by user, so we need to use visibility, each sorting type need its own list with its own visibility (according to selected in dropdown list)

For starting, try duplicate list and put them close to each other underneath, you might need to grow your screen in the editor, so you have more space to work with.

[neitham]

Thanks and sorry I could not follow. Can you please elaborate “so we need to use visibility, each sorting type need its own list with its own visibility (according to selected in dropdown list)”. Many thanks!

[Yongki]

Here is what it is looked like in runtime,

Database setup is like this,

This is for simple list,

This is for dropdown,

In the editor,
put visibility on first list and sorted as your choice,

the same thing for 2nd list, and put them close to each other,

I just make first list and duplicate it.

[neitham]

Very nice! Let me try. Many many thanks. This is interesting.

[neitham]

@Yongki With your tip, I could do it now! Huge thanks!

What I did is: In the database, I created a new collection Sorting. And I added a Text Property “Name”. I then Add the Sorting values - Name, Ratings, Date.

In the Sometimes Visible condition, I selected Form Inputs > Sort By (Name of the Menu) > Name (is equal to Name / Ratings / Date (based on the value in the Sorting collection) for each listing.

However, the screen seems to be small (vertically) when I place them underneath each other. In your previous reply, you mentioned about “grow your screen in the editor”. How do I grow/enlarge my screen vertically? When I put the list outside the screen it becomes invisible.

[Yongki]

Hi @neitham ,

That is great, you’re welcome.

To grow the screen, click name of the screen, at the very top, and you see yellow dots in four corners, drag it to below as much as you want the space to grow, just below, not left or right.

[neitham]

Thanks, that did it!

I also had to pull down the Tab Bar to the bottom of the screen too. Also, I think this will work horizontally too.