Dividize - Converting a table to a responsive DIV structure

Component ID

2628806

Component name

Dividize - Converting a table to a responsive DIV structure

Component type

module

Maintenance status

Development status

Component security advisory coverage

covered

Downloads

663

Component created

Component changed

Component body

Dividize is a customizable table plugin for jQuery. This module integrates the Dividize into Drupal.

Dividize takes the following options:

  • customHeaderTarget – If the table is not using th for headers, you can target other cells (e.g ‘table > tr:first-child td’ ).
  • addLabelHeaders – Add appropriate header elements to each created div cell.
  • hideLabels – Hide the above label headers in our div structure.
  • removeHeaders – Do not recreate the original headers in our div structure.
  • preserveEvents – Save events from elements in the table and apply them to the recreated elements in ours (Does not save events on table, thead, tbody, tfoot, th, tr, td).
  • preserveDim – Keep the table cell dimensions for our div cells.
  • classes – Add any extra classes to our root div element.
  • enableAltRows – Mark our rows with classes even/odd for css selectors

However like most things, there are some disadvantages to running this script on a table:

  • If there is css applied directly on the table elements, it will obviously not be applicable.
  • Saving events has some overhead since the script needs to check each and every element in cells.
  • This plugin creates significantly more html in the place of the table. It could be designed to generate less but personally I prefer it this way because it gives me more flexibility with with some divs acting as containers.