Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
TinySort is a small script that sorts HTML elements. It sorts by text- or attribute value, or by that of one of it's children.
JavaScript CSS HTML
branch: master

use cdn api in documentation to show latest

fixed img src in readme
latest commit c26f13518a
Ron Valstar authored

README.md

TinySort TinySort

TinySort is a small script that sorts HTMLElements. It sorts by text- or attribute value, or by that of one of it's children.

Documentation and examples are at tinysort.sjeiti.com.

usage

The first (and only required) argument is a NodeList, an array of HTMLElements or a string (which is converted to a NodeList using document.querySelectorAll).

tinysort(NodeList);

The other arguments can be an an options object.

tinysort(NodeList,{place:'end'});

If the option object only contains a selector you can suffice by using the selector string instead of the object.

tinysort(NodeList,'span.surname');

For multiple criteria you can just overload.

tinysort(NodeList,'span.surname','span.name',{data:'age'});

Default settings can be changed

tinysort.defaults.order = 'desc';
tinysort.defaults.attr = 'title';

options

The options object can have the following settings:

selector (String)

A CSS selector to select the element to sort to.

order (String='asc')

The order of the sorting method. Possible values are 'asc', 'desc' and 'rand'.

attr (String)

Order by attribute value (ie title, href, class)

data (String)

Use the data attribute for sorting.

place (String='org')

Determines the placement of the ordered elements in respect to the unordered elements. Possible values 'start', 'end', 'first', 'last' or 'org'.

useVal (Boolean=false)

Use element value instead of text.

cases (Boolean=false)

A case sensitive sort (orders [aB,aa,ab,bb])

forceStrings (Boolean=false)

If false the string '2' will sort with the value 2, not the string '2'.

ignoreDashes (Boolean=false)

Ignores dashes when looking for numerals.

sortFunction (function)

Override the default sort function. The parameters are of a type {elementObject}.

useFlex (Boolean=true)

If one parent and display flex, ordering is done by CSS (instead of DOM)

emptyEnd (Boolean=true)

Sort empty values to the end instead of the start

Something went wrong with that request. Please try again.