Sorting

Tables within a web application created with X4 Web Apps can be sorted by the values within a column.

In the example already used for Paging, some changes are made to be able to sort. First, the column in the List component must be marked as sortable (sortable="true").

XML

<ListComponent name="Sorting" path="Sorting" displayName="Paging" process="fillListProcess.wrf" default="true">
    <Properties>
    	<Property name="List" type="Complex">
            <Property name="Description" type="String" displayName="Description"/>
            <Property name="Id" type="Integer" displayName="Id"/>
        </Property>
     </Properties>
     <Columns>
        <Column value="#List.Id" sortable="true" />
        <Column value="#List.Description" />
     </Columns>
</ListComponent>

The column header now looks like this: . The symbol means that the sorting mechanism is activated. However, clicking on the column header does not change anything yet, the list is only reloaded without sorting.

New requests are necessary for sorting:

XML

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<Search offset="0" limit="50">
	<OrderBy>
		<Asc property="#List.Id" />
	</OrderBy>
	<Where />
</Search>

XML

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<Search offset="0" limit="50">
	<OrderBy>
		<Desc property="#List.Id" />
	</OrderBy>
	<Where />
</Search>

The <Asc> and <Desc> tags stand for ascending and descending sorting respectively. By using them, queries, mappings, etc. can be displayed as sorted lists.