10.26 Indexer

Description: The JET Indexer is usually associated with a scrollable JET ListView. It provides a list of sections that corresponds to group headers in ListView. When a section is selected, the corresponding group header will be scroll to the top of the ListView.

Component to accept the input: Switch



When user enables this switch, it will display an input box as shown in the image below.



Indexer key: This field accepts the key of the data on which grouping is based on.

Example: User wants a list with indexer and user want to group all list items based on the surname as shown in the image below.



Usage: Assume user have following data source of the list.

datasource= [{id: "1", first_name: "", last_name: "Dunphy"},
{id: "100", first_name: "Mozhe", last_name: "Atkinn"},
{id: "101", first_name: "Simon", last_name: "Austin"},
{id: "200", first_name: "Hermann", last_name: "Baer"},
{id: "201", first_name: "Shelli", last_name: "Baida"}, 
………
{id: "2300", first_name: "Eleni", last_name: "Zlotkey"} ]

Here surname is stored in last_name key.

Enable the switch and enter the indexer key as “last_name” as shown in the image below.