Example: Repeater Dropdown with Keyboard Navigation

Show and tell
,
1


This example demonstrates how to implement an autosuggest dropdown by using a Repeater with keyboard navigation. Use up/down arrows to make your selection, and the Enter key to accept the selected entry. The selection can also be made using the mouse/trackpad as usual.

This project was inspired by a recent forum discussion, Highlight an item Repeater - autocomplete menu , between two amazing users: Mauro Vento Avyno and David - skeptisch.net .

Go to the Repeater Dropdown example page.
See more examples at Gramp’s Workbench .

5 Likes
2

Wonderful trick @yisrael-wix you r the best :clap::clap::muscle::hugs:

3

is there example about
Changing the Direction of Menu Tabs Based on the Current Language ?

4

Hi, I’ve managed to replicate the example correctly including the data query.

However, the country name issued by the query still shows “country name” instead of the real country name. But when I click on “country name” real the country appears correctly.

The code seems to be good as the console do not show any error message. I believe it is about the dataset connection with the repeater but I’ve searched unsuccessfully.

Moreover, once the country is selected, how to add a specific action such as content or link to a specific page?

Any advice? Thanks

1036×684 14.8 KB

4096×2304 435 KB

5

Thanks to the wix support team, I’ve managed to clear this issue. Please make sure your dataset permission is open to everyone and not only restricted to the admin :slight_smile:

6

For the users, I am pleased to share my codes

1652×1978 404 KB

7

1312×1978 402 KB

8

My issue is now to set up an action (link to another page) once the country is selected.
Any recommendation??
Thanks
Mikael