Menu icon Foundation
Rails 4 searchable sortable table with pagination

Gist Code Here: https://gist.github.com/elricstorm/8923085
Implement Responsive Tables Here: http://foundation.zurb.com/docs/components/tables.html

Hi Everyone,

I've created a fully sortable, searchable table with pagination for all device types using:

Foundation 5.1.1
Kaminari
Foundation Responsive Tables
Rails 4.x

I've added all of the code, including scss in the gist above. The responsive tables and how to implement is also provided as is.

I used to use DataTables but found it to be cumbersome with responsive frameworks and wanted to create my own use case. You can further customize this to use .json and make your own ajax driven searchable tables. I hope this helps someone else out.

tablerailspagination

Gist Code Here: https://gist.github.com/elricstorm/8923085
Implement Responsive Tables Here: http://foundation.zurb.com/docs/components/tables.html

Hi Everyone,

I've created a fully sortable, searchable table with pagination for all device types using:

Foundation 5.1.1
Kaminari
Foundation Responsive Tables
Rails 4.x

I've added all of the code, including scss in the gist above. The responsive tables and how to implement is also provided as is.

I used to use DataTables but found it to be cumbersome with responsive frameworks and wanted to create my own use case. You can further customize this to use .json and make your own ajax driven searchable tables. I hope this helps someone else out.

Ron Huppert over 5 years ago

Thanks. I'll check it out.

I'm using Rails 4 with Foundation 4, but hopefully that won't be a factor.

John Kaczmarek almost 5 years ago

I was about to follow your lead but I found that DataTables has a Foundation theme. Way easier, but maybe less configureable... Maybe.

Check it out:
Datatables - http://datatables.net/
Foundation Example - http://datatables.net/dev/foundation.html
jquery-datatables-rails gem - https://github.com/rweng/jquery-datatables-rails