Sort DropDown Control

The sort dropdown control is used to sort HTML elements by the specified CSS selector using the HTML SELECT element. It is possible to sort text and numerical content.

<select data-grid-control="sort">
    <option data-type="initial" selected>Sort by</option>
    <option data-path=".title" data-direction="asc" data-type="text">Sort by title asc</option>
    <option data-path=".title" data-direction="desc" data-type="text">Sort by title desc</option>
    <option data-path=".price" data-direction="asc" data-type="number">Sort by price asc</option>
    <option data-path=".price" data-direction="desc" data-type="number">Sort by price desc</option>

Select data attributes

Option elements data attributes

The selected option should be marked with the selected attribute.

Sort Types

Last updated