• If you are citizen of an European Union member nation, you may not use this service unless you are at least 16 years old.

  • You already know Dokkio is an AI-powered assistant to organize & manage your digital files & messages. Very soon, Dokkio will support Outlook as well as One Drive. Check it out today!

View
 

Grid-Sorting

Page history last edited by Richard D. Worth 12 years, 7 months ago

Sorting includes a widget for single column sorting: Indicating clicks areas, handling input, outputting current sort directions. The widget must be flexible enough to allow implementing mutli-column sorting, too.

The widget must communicate with the data model to indicate which columns to sort in which direction (if sortable in the first place), and to display the current sort order.

 

Resources:

 

 

Reference Screenshots for Microsoft Excel 2010 Sort UI

 

Microsoft Excel 2010 uses a sort menu activated by a drop-down at the right of each data column header.

 

Built-in sort options (ascending and descending) are type-specific:

  • Text
    • Sort A to Z
    • Sort Z to A
  • Number
    • Sort Smallest to Largest
    • Sort Largest to Smallest
  • Date
    • Sort Oldest to Newest
    • Sort Newest to Oldest

 

 

Below those is a custom sort option which activates a custom sort dialog:

 

 

This allows for any number of sort fields to be added, removed and reordered. For each sort field the user can select the column and the direction.

 

 

Notes on Grid Sorting from 2010-Mar meeting

- Top-level data-ui-sortable="true" on table

- Specify the column types (way to specify  types)

  -  Specified as an array of values

  - PE: data-ui-format="currency" vs.  data-ui-l10n-format="currency"

- Specify the starting sort direction (desc,  asc)

  -  data-ui-sortdir="desc"

- Enable/Disable Sorting on a particular column

  -  data-ui-sortable="false"

- Depends upon Type(i18n/l10n) plugin

Comments (2)

Marcus Ekwall said

at 9:56 am on Feb 28, 2011

I've released the generic sorting plugin on github: https://github.com/mekwall/jquery-generic-sorter

Jörn Zaefferer said

at 1:33 pm on Jun 19, 2011

Sortable columns need a visual indicator that they can sorted.

You don't have permission to comment on this page.