Skip to content
This repository has been archived by the owner on Jul 24, 2020. It is now read-only.

dataTables (pagination, sorting, search)

dgoerger edited this page Jun 22, 2012 · 5 revisions

Project and implementation info

https://github.com/phronos/rails_datatables

http://railscasts.com/episodes/340-datatables

Added to Reservations/rails3_upgrade branch on 2012.06.13 by @dgoerger in order to give table data pagination, sort, and search functionality.

Where / How we use it

The railscast explains exactly how to implement it, and is in fact the first railscast @dgoerger has found wherein Ryan Bates' steps actually produce the desired results on the first try.

Files edited

  • Gemfile => gem 'jquery-datatables-rails'
  • application.js => require dataTables/jquery.dataTables
  • application.js => $(document).ready(function() { $('#[table_id_name_minus_brackets]').dataTable() });
  • ^^ necessary for the gem to know which table to style
  • application.css => require dataTables/jquery.dataTables
  • index.html.erb (for categories, equipment_models, equipment_objects, users) and _reservations_list.html.erb => as per the Railscast 340
  • ^^ necessary for the gem to be able to format the tables correctly. really minor edits. (literally just table#id="__", <thead />, and <tbody />)

Things to watch out for

  • If there are four columns of data and less than three columns are defined in the header, the table will not be sortable. You can fix this by adding lines of blank <th> </th> tags (for example for the Edit and De-Activate columns).
  • If dataTables is broken, datepicker might also fail. At the present we do not know why this is. Fixing dataTables seems to resolve both.
  • Sorting numbers with HTML formatting (such as links on the Reservations List page) does not work by default; we needed to add the num-html datatype: http://datatables.net/plug-ins/type-detection and http://datatables.net/plug-ins/sorting (Numbers with HTML)