DataTables Blog http://www.datatables.net/blog en-us Tutorials and news about DataTables RowGroup - new extension Grouping rows into sets of data that share a single characteristic can be very powerful tool to let end user's understand and take knowledge from a complex data set. A DataTable will provide a base grouping (for example showing a list of students), but you might also wish to group by a data point inside the table (e.g. age in the case of the students example).

The DataTables examples have long included an example showing how row grouping can be done, but any customisation requires modification of the code presented that, and it isn't always intuitive what those changes should be if the developer is new to DataTables. As such, it gives me great pleasure to introduce a new extension for DataTables: RowGroup.

Name Position Office Salary

Continue reading...

]]>
Fri, 07 Apr 2017 15:08:00 GMT http://www.datatables.net/blog/2017-04-07 http://www.datatables.net/blog/2017-04-07
Ajax loaded row details Showing detailed information about a row in a DataTable is a popular feature. It allows the main table view to be accessible and easy for the end user to process, while also allowing them to drill into more detailed data in a structured way.

DataTables provides child rows API methods (row().child(), row().child().show(), etc) to let you easily display detail rows such as these. There is even a simple example on this site.

The topic for this post is to built upon that example, describing how to handle a simple, but commonly requested, extension to it: to load the data for the child row asynchronously via Ajax rather than simply using the data already in the table.

The table below shows an example of what we will build in this article. Clicking on the show icon will display a "Loading" message, which is then replaced by data that has been Ajax loaded from the server. In this demo an artificial two second delay has been added to the server-side script so you can see the loading message and that then being replaced by the loaded information.

Name Position Office Salary
Name Position Office Salary

Continue reading...

]]>
Fri, 31 Mar 2017 21:43:00 GMT http://www.datatables.net/blog/2017-03-31 http://www.datatables.net/blog/2017-03-31
Locale based sorting Let's stereotype for a moment: developers whose first (and in many cases, such as my own, only) language is English, don't always appreciate localisation issues to the degree we should. With people using DataTables all over the world (68 community translations for DataTables core) this is something that I'm very aware of as a library developer.

While DataTables offers options for localisation of the text it uses, we also need to consider the data that the table contains. Sorting is one area where this has proven to be particularly difficult to get right, but fortunately with new Javascript APIs that are now available in browsers, we can get locale based sorting absolutely right every time.

Also, don't make the mistake of thinking that this post is only for developers who are working in languages other than English - the sorting options made available by the Intl API offer something for everyone!

Continue reading...

]]>
Tue, 28 Feb 2017 13:18:00 GMT http://www.datatables.net/blog/2017-02-28 http://www.datatables.net/blog/2017-02-28
Search highlighting with mark.js

Contributed post

This post has been written by Julian Motz, the author of mark.js and discusses the integration options between DataTables and his search highlighting library, providing far more functionality than the program developed in my original post on this topic.

If you're googling for DataTables or any other keyword you'll notice that the search keyword will be highlighted in the description of each result. This behaviour allows users to find what they're searching for more faster and therefore leads to a better usability.

DataTables itself offers a search feature that filters a table to only show relevant rows. But it doesn't offer built-in keyword highlighting within these results. If you'd like to improve the usability for your users too, keep on reading.

Continue reading...

]]>
Thu, 19 Jan 2017 12:00:00 GMT http://www.datatables.net/blog/2017-01-19 http://www.datatables.net/blog/2017-01-19