Working modes

The KingTable implements two working modes:

• fixed
• normal

Fixed mode

A fixed table is displaying a collection that doesn't require server side pagination, but may still benefit from client side pagination. When working on applications, it commonly happens to deal with collections that are not meant to grow over time, and they have a small size. For example, a table of categories in a e-commerce website to sell clothes, or a table of user roles in most applications. In these cases, it makes sense to return whole collections to the client. There are two ways to define a fixed KingTable:

• instantiating a KingTable with url from where to fetch a collection; then code the server side to return an array of items
• instantiating a KingTable passing a data option with an instance of array: in this case, it is assumed that the collection is fixed

var table = new KingTable({
  // {...} other options
  data: [{...},{...},{...}]
});
//or... code the server side to return an array of items
var table = new KingTable({
  // {...} other options
  url: "/api/categories",
  fixed: true
});

Fixed tables perform search and pagination on the client side; but normal tables don`t do anything about sorting and filtering. This is not an arbitrary decision, but rather a necessity given by the task itself:

• the purpose of server side pagination is to deal with collections that are too big, to be sent whole from server to client
• when paginating, the page number depends upon the total amount of possible results (given the filters) and upon the sort criteria (e.g. order by "something")
• therefore, when paginating server side, sorting and filtering must happen server side, too
• on the other hand, when paginating client side (because some collections allow it), filtering and ordering must happen on the client side, in order to benefit from absence of ajax calls and to offer the best user experience

The KingTable library offers out of the box client side sort and search functionalities, and a structure to define filtering functions. Please refer to implementing custom filters page, for information about how to implement filtering functions on the client side.

Normal mode

A normal table is one displaying a collection that requires server side pagination, since it is meant to grow over time. This is true in most cases, for example tables of products and customers in a e-commerce website.

var table = new KingTable({
  // {...} other options
  url: "/api/profiles"
});

When receiving an AJAX response it expects the following structure, if results are paginated server side:

{
  subset: [array],// array of items that respect the given filters
  total: [number] // the total count of items that respect the given filters; excluding the pagination: for example 13000
}

For information about handling of fast growing collections, refer to the dedicate page.

---

Collection modes

The KingTable library supports both optimized and simple collections, where:

Optimized collections

An optimized collection is an array of arrays, where the first array contains the names of the properties, and following arrays contain the items' values.

[
  [
    "red",
    "hue",
    "hsvSaturation",
    "hslSaturation",
    "hsvValue",
    "hslLight",
    "green",
    "blue",
    "name",
    "color"
  ],
  [
    "0%",
    "217\u00b0",
    "100%",
    "100%",
    "73%",
    "37%",
    "28%",
    "73%",
    "Absolute Zero",
    "#0048BA"
  ],
  //...

Simple collections

A simple collection is an array of objects, with properties and values.

[
  {
    "color": "#0048BA",
    "red": "0%",
    "hue": "217\u00b0",
    "name": "Absolute Zero",
    "blue": "73%",
    "hsvSaturation": "100%",
    "green": "28%",
    "hsvValue": "73%",
    "hslSaturation": "100%",
    "hslLight": "37%"
  },
  {
    "color": "#B0BF1A",
    "red": "69%",
    "hue": "65\u00b0",
    "name": "Acid green",
    "blue": "10%",
    "hsvSaturation": "86%",
    "green": "75%",
    "hsvValue": "75%",
    "hslSaturation": "76%",
    "hslLight": "43%"
  },
  //...