tabulatr2 0.8.9 → 0.9.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: e5ce50ecf99d801c82194b66ada63d0f89cb3d23
-  data.tar.gz: df7ffad4b2cd63c92c6d18279b8b1f1ecd9dfd28
+  metadata.gz: 33bcdd2d48f79be42e48d96f15856c24731b6543
+  data.tar.gz: db9ecdc0fb072cd452233d3a181bf1524cc0e6d1
 SHA512:
-  metadata.gz: 8ae9fba512fd7395ebc96e3bf0e03b0c909e0985f96165d7aa81b88d1aac71a50dc871c2f6702b3953774a56ff23d61165d49c1418061ace5dc1a421a5aaba63
-  data.tar.gz: 158c404a8e6bd33faf8728f641f278972cb2d72d7c3fc2bb11bfd03ea74929cf39325b085fb27f5d3415ca65b07b5acb4047bb5c9b9f74ad3bafbb438a35ea3b
+  metadata.gz: b88025d3af65dd7cceaa36ab28512767de961cd4bbd35878ec5be326456112aaf2ef7ed695ad9f8d8a7b87118c0330f0df1f09ee96aa79986048fd3946754725
+  data.tar.gz: 695b0ee5be5f34b8c6464b014ce11e5c4a814ec817469f6100f8f76bc7ec77a9c41190c4da675a7a9c2753c1500993209bd02ab74cefebd73790499001e8fee2

data/CHANGELOG.md

@@ -1,3 +1,28 @@
+## 0.9
+
+* Added `row` to the TabulatrData DSL to provide HTML attributes for the
+  table_row of each record.
+
+  Example:
+  ```
+  row do |record, row_config|
+    if record.super_important?
+      row_config[:class] = 'important';
+    end
+    row_config[:data] = {
+      href: edit_user_path(record.id),
+      vip: record.super_important?
+    }
+  end
+  ```
+
+* Added `id` of record as `data-id` of table row in static table if
+  id is available.
+
+* Added `columns` keyword argument to `table_for`
+
+* Added `checkbox` to the TabulatrData DSL
+
 ## 0.8.9
 
 * fix sorting, filtering, searching and batch_actions for tables whose class

data/Gemfile

@@ -22,5 +22,5 @@ group :development, :test do
   gem 'database_cleaner', '< 1.1.0'
   gem 'poltergeist'
   gem 'sass-rails', '~> 4.0.0'
-  gem 'bootstrap-sass', github: 'thomas-mcdonald/bootstrap-sass', branch: '3'
+  gem 'bootstrap-sass', '~> 3.0.3.0'
 end

data/README.md

@@ -14,14 +14,8 @@ After that run `bundle install`.
 Also add `//= require tabulatr` to your application js file and `*= require tabulatr` to your CSS asset
 pipeline.
 
-If you want to create a `tabulatr` table for an existing model run
-`rails g tabulatr:install product`.
-
-This will generate a `ProductTabulatrData` class in `app/tabulatr_data/product_tabulatr_data.rb` for you.
-
-You can also run the generator for a new model, if you just run the standard Rails `resource` generator.
-
-`rails g resource Product title:string vendor:references description:text`
+Now run the Install generator via
+`rails g tabulatr install`
 
 ## Usage
 
@@ -79,6 +73,13 @@ end
 ```
 The search method is used for a fuzzy search field.
 
+You can automatically generate a new TabulatrData-Class by running
+`rails g tabulatr:table MODELNAME`.
+
+This will generate a `MODELNAMETabulatrData` class in `app/tabulatr_data/MODELNAME_data.rb` for you.
+
+This generator also gets executed if you just run the standard Rails `resource` generator.
+
 ## Controller
 
 In `ProductsController#index` we have:
@@ -99,6 +100,22 @@ _Hint:_ If you want to prefilter your table, you can do that too! Just pass an `
 ### View
 
 In the view we can use all the attributes which are defined in our `ProductTabulatrData` class.
+To display all the columns defined in the `ProductTabulatrData` class we
+just need to put the following statement in our view:
+
+```erb
+<%= table_for Product %>
+```
+If you just want do display a subset of the defined columns or show them in a
+different order you can provide them as arguments to the `columns` key:
+
+```erb
+<%= table_for Product, columns: [:vendor_address, 'vendor:name', {tags: :title}]%>
+```
+Note that you can write associations as a string with colon between association
+name and method or as a hash as you can see above.
+
+An other option is to provide the columns in a block:
 
 ```erb
   <%= table_for Product do |t|
@@ -178,49 +195,63 @@ These options should be specified at the view level as parameters to the `table_
 They change the appearance and behaviour of the table.
 
 ```ruby
-  # which controls to be rendered above and below the table and in which order
-  :before_table_controls => [:filter, :paginator],
-  :after_table_controls => [],
-
-  :table_html => false,              # a hash with html attributes for the table
-  :header_html => false,             # a hash with html attributes for the header trs
-  :filter_html => false,             # a hash with html attributes for the filter trs
-  :filter => true,                   # false for no filter row at all
-  :paginate => false,                # true to show paginator, false for endless scrolling.
-                                     # number for limit of items to show via pagination
-  :sortable => true,                 # true to allow sorting (can be specified for every sortable column)
-  :batch_actions => false,           # :name => value hash of batch action stuff
-  :path => '#'                       # where to send the AJAX-requests to
+  filter: true,          # false for no filter row at all
+  search: true,          # show fuzzy search field
+  paginate: false,       # true to show paginator
+  pagesize: 20,          # default pagesize
+  sortable: true,        # true to allow sorting (can be specified for every sortable column)
+  batch_actions: false,  # :name => value hash of batch action stuff
+  footer_content: false, # if given, add a <%= content_for <footer_content> %> before the </table>
+  path: '#',             # where to send the AJAX-requests to
+  order_by: nil          # default order
+```
+
+#### Example:
+```erb
+<%= table_for Product, {order_by: 'price desc', pagesize: 50} %>
 ```
 
 ### Column Options
 
+You can specify these options either in your `TabulatrData` class or to
+the columns in the block of `table_for`.
+
 ```ruby
-  :header => false,                   # a string to write into the header cell
-  :width => false,                    # the width of the cell
-  :align => false,                    # horizontal alignment
-  :valign => false,                   # vertical alignment
-  :wrap => true,                      # wraps
-  :type => :string,                   # :integer, :date
-  :th_html => false,                  # a hash with html attributes for the header cell
-  :filter_html => false,              # a hash with html attributes for the filter cell
-  :filter => true,                    # false for no filter field,
-                                       # container for options_for_select
-                                       # String from options_from_collection_for_select or the like
-                                       # :range for range spec
-                                       # :checkbox for a 0/1 valued checkbox
-  :checkbox_value => '1',             # value if checkbox is checked
-  :checkbox_label => '',              # text behind the checkbox
-  :filter_width => '97%',             # width of the filter <input>
-  :range_filter_symbol => '&ndash;',  # put between the <inputs> of the range filter
-  :sortable => true,                  # if set, sorting-stuff is added to the header cell
-  :format_methods => []               # javascript method to execute on this column
+  header: nil,           # override content of header cell
+  classes: nil,          # CSS classes for this column
+  width: false,
+  align: false,
+  valign: false,
+  wrap: nil,
+  th_html: false,
+  filter_html: false,
+  filter: true,          # whether this column should be filterable
+  checkbox_value: '1',
+  checkbox_label: '',
+  sortable: true,        # whethter this column should be sortable
+  format: nil,
+  map: true,
+  cell_style: {},        # CSS style for all body cells of this column
+  header_style: {}       # CSS style for all header cells of this column
 ```
 
+#### Example:
+```erb
+# in the view
+<%= table_for Product do |t|
+  t.column(:title, header_style: {color: 'red'})
+  # ...
+%>
+
+# or in TabulatrData
+class ProductTabulatrData < Tabulatr::Data
+  column(:title, table_column_options: {header_style: {color: 'red'}})
+end
+```
 
 ## Dependencies
 
-We use [whiny_hash](http://github.com/provideal/whiny_hash) to handle the options in a fail-early-manner.
+We use [Bootstrap from Twitter](http://getbootstrap.com) in order to make the table look pretty decent.
 
 ## Known Bugs
 
@@ -231,11 +262,6 @@ And this limit is hard-coded IIRC. So – If you run into this limitation –
 please consider using another server.
 (Thanks to [stepheneb](https://github.com/stepheneb) for calling my attention back to this.)
 
-## Other, new bugs
-
-There are roughly another 997 bugs in Tabulatr2, although we do some testing.
-If you hunt them, please file an issue.
-
 ## Contributing
 
 * Check out the latest master to make sure the feature hasn't been implemented or the bug hasn't been fixed yet

data/app/assets/javascripts/tabulatr/application.js

@@ -19,105 +19,109 @@
 //  OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
 //  WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 
-Tabulatr = {
-  moreResults: true,
-  storePage: false,
-  currentData: null,
-  locked: false,
-
-  updatePagination: function(currentPage, numPages, tableId){
-    var ul = $('.pagination[data-table='+ tableId +'] > ul');
-    if(ul.length == 0){
-      // bootstrap 3
-      ul = $('.pagination[data-table='+ tableId +']');
+function Tabulatr(id){
+  this.id = id;
+  this.name = '';
+  this.moreResults = true;
+  this.currentData = null;
+  this.locked = false;
+}
+
+var tabulatr_tables;
+Tabulatr.prototype = {
+  constructor: Tabulatr,
+
+  createPaginationListItem: function(page, active){
+    var $page = $('<li><a href="" data-page="'+ page +'">'+ page +'</a></li>');
+    if(active){
+      $page.addClass('active');
     }
-    ul.html('');
+    return $page;
+  },
+
+  updatePagination: function(currentPage, numPages){
+    var $paginatorUl = $('.pagination[data-table='+ this.id +'] > ul');
+
+    $paginatorUl.html('');
     if(numPages < 13){
       for(var i = 1; i <= numPages; i++){
-        var cls = '';
-        if(i == currentPage){
-          cls = 'active';
-        }
-        ul.append('<li class="'+ cls +'"><a href="#" data-page="'+ i+'">'+
-          i +'</a></li>');
+        $paginatorUl.append(this.createPaginationListItem(i, (i == currentPage)));
       }
     }else{
       if(currentPage > 1){
-        ul.append('<li><a href="#" data-page="1">1</a></li>');
+        $paginatorUl.append(this.createPaginationListItem(1, false));
       }
 
       var between = Math.floor((1 + currentPage) / 2);
       if(between > 1 && between < currentPage - 2){
-        ul.append('<li><span>...</span></li>');
-        ul.append('<li><a href="#" data-page="'+ between +'">'+ between +'</a></li');
+        $paginatorUl.append('<li><span>...</span></li>');
+        $paginatorUl.append(this.createPaginationListItem(between, false));
       }
 
       if(currentPage > 4){
-        ul.append('<li><span>...</span></li>');
+        $paginatorUl.append('<li><span>...</span></li>');
       }
 
       if(currentPage > 3){
-        ul.append('<li><a href="#" data-page="'+ (currentPage - 2) +'">'+
-          (currentPage-2) +'</a></li>');
-        ul.append('<li><a href="#" data-page="'+ (currentPage - 1) +'">'+
-          (currentPage-1) +'</a></li>');
+        $paginatorUl.append(this.createPaginationListItem(currentPage-2, false));
+        $paginatorUl.append(this.createPaginationListItem(currentPage-1, false));
       }
 
-      ul.append('<li class="active"><a href="#" data-page="'+ currentPage +'">'+
-        currentPage +'</a></li>');
+      $paginatorUl.append(this.createPaginationListItem(currentPage, true));
 
       if(currentPage < numPages - 1){
-        ul.append('<li><a href="#" data-page="'+ (currentPage+1) +'">'+
-          (currentPage+1) +'</a></li>');
+        $paginatorUl.append(this.createPaginationListItem(currentPage+1, false));
       }
 
       if(currentPage < numPages - 2){
-        ul.append('<li><a href="#" data-page="'+ (currentPage+2) +'">'+
-          (currentPage+2) +'</a></li>');
+        $paginatorUl.append(this.createPaginationListItem(currentPage+2, false));
       }
 
       if(currentPage < numPages - 3){
-        ul.append('<li><span>...</span></li>');
+        $paginatorUl.append('<li><span>...</span></li>');
       }
 
       between = Math.floor((currentPage + numPages) / 2);
 
       if(between > currentPage + 3 && between < numPages - 1){
-        ul.append('<li><a href="#" data-page="'+ between +'">'+
-          between +'</a></li>');
-        ul.append('<li><span>...</span></li>');
+        $paginatorUl.append(this.createPaginationListItem(between, false));
+        $paginatorUl.append('<li><span>...</span></li>');
       }
       if(currentPage < numPages){
-        ul.append('<li><a href="#" data-page="'+ numPages +'">'+
-          numPages +'</a></li>');
+        $paginatorUl.append(this.createPaginationListItem(numPages, false));
       }
     }
 
   },
 
-  updateTable: function(hash, tableId, forceReload) {
+  updateTable: function(hash, forceReload) {
+    var $table = $('#'+ this.id);
     if(hash.page !== undefined && !forceReload){
       //old page should be stored
       Tabulatr.storePage = true;
       // check if this page was already loaded
-      if($('#'+ tableId + ' tbody tr[data-page='+ hash.page +']').length > 0){
-        $('#'+ tableId + ' tbody tr').hide();
-        $('#'+ tableId + ' tbody tr[data-page='+ hash.page +']').show();
+      if($table.find('tbody tr[data-page='+ hash.page +']').length > 0){
+        $table.find('tbody tr').hide();
+        $table.find('tbody tr[data-page='+ hash.page +']').show();
 
-        Tabulatr.updatePagination(hash.page,
-          $('.pagination[data-table='+ tableId +'] a:last').data('page'),
-          tableId);
+        this.updatePagination(hash.page,
+          $('.pagination[data-table='+ this.id +'] a:last').data('page'),
+          this.id);
         return;
       }
     }else{
-      Tabulatr.storePage = false;
+      this.storePage = false;
     }
-    if(Tabulatr.locked){ return; }
-    Tabulatr.locked = true;
-    jQuery.get($('table#'+ tableId).data('path') + '.json',
-        Tabulatr.createParameterString(hash, tableId),
-        Tabulatr.handleResponse
-      );
+    if(this.locked){ return; }
+    this.locked = true;
+    var curTable = this;
+    $.ajax({
+      context: this,
+      type: 'GET',
+      url: $('table#'+ this.id).data('path') + '.json',
+      data: this.createParameterString(hash, this.id),
+      success: this.handleResponse
+    });
   },
 
   checkIfCheckboxesAreMarked: function(){
@@ -125,32 +129,30 @@ Tabulatr = {
   },
 
   handleResponse: function(response) {
-    Tabulatr.insertTabulatrData(response);
-    Tabulatr.updatePagination(response.meta.page, response.meta.pages, response.meta.table_id);
-    Tabulatr.locked = false;
+    this.insertTabulatrData(response);
+    this.updatePagination(response.meta.page, response.meta.pages, response.meta.table_id);
+    this.locked = false;
   },
 
   insertTabulatrData: function(response){
-    var columns = [];
     var tableId = response.meta.table_id;
-    var tableName = tableId.split('_')[0];
     var tbody = $('#'+ tableId +' tbody');
     if(!response.meta.append){
-      if(Tabulatr.storePage){
+      if(this.storePage){
         $('#'+ tableId +' tbody tr').hide();
       }else{
         $('#'+ tableId +' tbody').html('');
       }
     }
-    if(response.data.length == 0){
-      Tabulatr.moreResults = false;
+    if(response.data.length === 0){
+      this.moreResults = false;
       $('.pagination_trigger[data-table='+ tableId +']').unbind('inview');
     }else{
       if(response.data.length < response.meta.pagesize){
-        Tabulatr.moreResults = false;
+        this.moreResults = false;
         $('.pagination_trigger[data-table='+ tableId + ']').unbind('inview');
       }else{
-        Tabulatr.moreResults = true;
+        this.moreResults = true;
       }
 
       // insert the actual data
@@ -159,13 +161,18 @@ Tabulatr = {
         var id = data.id;
         var tr = $('tr.empty_row').clone();
         tr.removeClass('empty_row');
+        if(data._row_config.data){
+          tr.data(data._row_config.data);
+          delete data._row_config.data;
+        }
+        tr.attr(data._row_config);
         tr.attr('data-page', response.meta.page);
         tr.attr('data-id', id);
         tr.find('td').each(function(i,td_raw) {
           var td = $(td_raw);
           var coltype = td.data('tabulatr-type');
           var name = td.data('tabulatr-column-name');
-          var cont = data[name]
+          var cont = data[name];
           if(coltype === 'checkbox') {
             cont = $("<input>").attr('type', 'checkbox').val(id).addClass('tabulatr-checkbox');
           }
@@ -184,49 +191,47 @@ Tabulatr = {
   },
 
   replacer: function(match, attribute, offset, string){
-    return Tabulatr.currentData[attribute];
+    return this.currentData[attribute];
   },
 
 
   makeAction: function(action, data){
-    Tabulatr.currentData = data;
-    return unescape(action).replace(/{{([\w:]+)}}/g, Tabulatr.replacer);
+    this.currentData = data;
+    return unescape(action).replace(/{{([\w:]+)}}/g, this.replacer);
   },
 
-  submitFilterForm: function(tableId){
-    if($('.pagination[data-table='+ tableId +']').length == 0){
-      $('.pagination_trigger[data-table='+ tableId +']').unbind('inview', cbfn);
-      $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
+  submitFilterForm: function(){
+    if($('.pagination[data-table='+ this.id +']').length === 0){
+      $('.pagination_trigger[data-table='+ this.id +']').unbind('inview', cbfn);
+      $('.pagination_trigger[data-table='+ this.id +']').bind('inview', cbfn);
     }
-    Tabulatr.updateTable({page: 1, append: false}, tableId, true);
+    this.updateTable({page: 1, append: false}, true);
     return false;
   },
 
-  createParameterString: function(hash, tableId){
-    var tableName = tableId.split('_')[0];
+  createParameterString: function(hash){
+    var tableName = this.id.split('_')[0];
     if(hash === undefined){
       hash = {};
       hash.append = false;
     }
-    if(hash.pagesize === undefined){
-      var pagesize = $('table#'+ tableId).data('pagesize');
-      if(pagesize == null) {
-        console.log('Tabulatr: No pagesize specified')
-      }
+    var pagesize = hash.pagesize;
+    if(pagesize === undefined){
+      pagesize = $('table#'+ this.id).data('pagesize');
     }
     if(hash.page === undefined){
-      hash.page = Math.floor($('#'+ tableId +' tbody tr[class!=empty_row]').length/pagesize) + 1;
+      hash.page = Math.floor($('#'+ this.id +' tbody tr[class!=empty_row]').length/pagesize) + 1;
       if(!isFinite(hash.page)){
         hash.page = 1;
       }
     }
     hash.pagesize = pagesize;
-    hash.arguments = $.map($('#'+ tableId +' th'), function(n){
-      return $(n).data('tabulatr-column-name')
-    }).filter(function(n){return n}).join();
-    hash.table_id = tableId;
+    hash.arguments = $.map($('#'+ this.id +' th'), function(n){
+      return $(n).data('tabulatr-column-name');
+    }).filter(function(n){return n; }).join();
+    hash.table_id = this.id;
     hash[tableName + '_search'] = $('input#'+ tableName +'_fuzzy_search_query').val();
-    var form_array = $('.tabulatr_filter_form[data-table="'+ tableId +'"]')
+    var form_array = $('.tabulatr_filter_form[data-table="'+ this.id +'"]')
       .find('input:visible,select:visible,input[type=hidden]').serializeArray();
     for(var i = 0; i < form_array.length; i++){
       hash[form_array[i].name] = form_array[i].value;
@@ -237,9 +242,12 @@ Tabulatr = {
   localDate: function(value, $td, $tr, obj){
     return new Date(value).toLocaleString();
   }
+
 }
 
+
 $(document).on('ready page:load', function(){
+  tabulatr_tables = [];
 
   $('th.tabulatr-sortable').click(function(){
     var th = $(this);
@@ -247,26 +255,32 @@ $(document).on('ready page:load', function(){
     var dir = th.attr('data-sorted');
     var table = th.parents('table');
     var tableId = table.attr('id');
-    var tableName = tableId.split('_')[0];
+    var table_obj = undefined;
+    for(var i = 0; i < tabulatr_tables.length; i++){
+      if(tabulatr_tables[i].id == tableId){
+        table_obj = tabulatr_tables[i];
+      }
+    }
+    var tableName = table_obj.id.split('_')[0];
     table.find('th.tabulatr-sortable.sorted').removeClass('sorted').removeAttr('data-sorted');
     dir = (dir === 'asc') ? 'desc' : 'asc';
     th.addClass('sorted').attr('data-sorted', dir);
     $('.tabulatr_filter_form[data-table='+ tableId +'] input[name='+ tableName +'_sort]').val(sort_by + ' '+  dir);
-    if(!Tabulatr.moreResults){
-      Tabulatr.moreResults = true;
-      if($('.pagination[data-table='+ tableId +']').length == 0){
+    if(!table_obj.moreResults){
+      table_obj.moreResults = true;
+      if($('.pagination[data-table='+ tableId +']').length === 0){
         $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
       }
     }
     $($(this).parents('table').find('tbody tr')).remove();
 
     $('.tabulatr_mark_all[data-table='+ tableName +']').prop('checked', false).prop('indeterminate', false);
-    Tabulatr.updateTable({}, tableId);
+    table_obj.updateTable({});
   });
 
 
   $('.tabulatr_table').each(function(ix, el){
-    if($('.pagination[data-table="'+ $(el).attr('id') +'"]').length == 0){
+    if($('.pagination[data-table="'+ $(el).attr('id') +'"]').length === 0){
       $('.pagination_trigger[data-table="'+ $(el).attr('id') +'"]').bind('inview', cbfn);
     }
   });
@@ -278,25 +292,43 @@ $(document).on('ready page:load', function(){
     var tableId = a.data('table-id');
     var params = {page: 1};
     params[name] = key;
-    params['tabulatr_checked'] = {checked_ids: jQuery.map($('#'+ tableId +' .tabulatr-checkbox:checked'), function(el){return $(el).val();}).join(',')};
+    params.tabulatr_checked = {checked_ids: jQuery.map($('#'+ tableId +' .tabulatr-checkbox:checked'), function(el){return $(el).val();}).join(',')};
     $('.tabulatr_mark_all[data-table='+ tableId +']').prop('indeterminate', false).prop('checked', false);
     $('#'+ tableId +' .tabulatr-wrench').addClass('disabled');
-    Tabulatr.updateTable(params, tableId, true);
+    var table_obj = undefined;
+    for(var i = 0; i < tabulatr_tables.length; i++){
+      if(tabulatr_tables[i].id == tableId){
+        table_obj = tabulatr_tables[i];
+      }
+    }
+    table_obj.updateTable(params, true);
   });
 
   $('form.tabulatr-fuzzy-search').submit(function(){
     var tableId = $(this).data('table');
-    if($('.pagination[data-table='+ tableId +']').length == 0){
+    if($('.pagination[data-table='+ tableId +']').length === 0){
       $('.pagination_trigger[data-table='+ tableId +']').unbind('inview', cbfn);
       $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
     }
-    Tabulatr.updateTable({page: 1, append: false}, tableId, true);
+    var table_obj = undefined;
+    for(var i = 0; i < tabulatr_tables.length; i++){
+      if(tabulatr_tables[i].id == tableId){
+        table_obj = tabulatr_tables[i];
+      }
+    }
+    table_obj.updateTable({page: 1, append: false}, true);
     return false;
   });
 
-  $('form.tabulatr_filter_form').submit(function(ev){
+  $('form.tabulatr_filter_form').submit(function(){
     var tableId = $(this).data('table');
-    Tabulatr.submitFilterForm(tableId);
+    var table_obj = undefined;
+    for(var i = 0; i < tabulatr_tables.length; i++){
+      if(tabulatr_tables[i].id == tableId){
+        table_obj = tabulatr_tables[i];
+      }
+    }
+    table_obj.submitFilterForm();
     return false;
   });
 
@@ -313,21 +345,33 @@ $(document).on('ready page:load', function(){
     }
     var tableId = $(this).closest('.tabulatr_table').attr('id');
     $(this).remove();
-    if($('.pagination[data-table='+ tableId +']').length == 0){
+    if($('.pagination[data-table='+ tableId +']').length === 0){
       $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
     }
-    Tabulatr.updateTable({}, tableId);
+    var table_obj = undefined;
+    for(var i = 0; i < tabulatr_tables.length; i++){
+      if(tabulatr_tables[i].id == tableId){
+        table_obj = tabulatr_tables[i];
+      }
+    }
+    table_obj.updateTable({});
     return false;
   });
 
   $('.tabulatr_mark_all').click(function(){
     var tableId = $(this).data('table');
+    var table_obj = undefined;
+    for(var i = 0; i < tabulatr_tables.length; i++){
+      if(tabulatr_tables[i].id == tableId){
+        table_obj = tabulatr_tables[i];
+      }
+    }
     if($(this).is(':checked')){
       $('#'+ tableId +' tr[data-page]:visible input[type=checkbox]').prop('checked', true);
       $('#'+ tableId +' .tabulatr-wrench').removeClass('disabled');
     }else{
       $('#'+ tableId +' tr[data-page]:visible input[type=checkbox]').prop('checked', false);
-      if(Tabulatr.checkIfCheckboxesAreMarked()){
+      if(table_obj.checkIfCheckboxesAreMarked()){
         $('#'+ tableId +' .tabulatr-wrench').removeClass('disabled');
       }else{
         $('#'+ tableId +' .tabulatr-wrench').addClass('disabled');
@@ -337,6 +381,12 @@ $(document).on('ready page:load', function(){
 
   $('.tabulatr_table').on('click', 'input.tabulatr-checkbox', function(){
     var tableId = $(this).closest('.tabulatr_table').attr('id');
+    var table_obj = undefined;
+    for(var i = 0; i < tabulatr_tables.length; i++){
+      if(tabulatr_tables[i].id == tableId){
+        table_obj = tabulatr_tables[i];
+      }
+    }
     if($(this).is(':checked')){
       if($('#'+ tableId +' tr[data-page]:visible input[type=checkbox]').not(':checked').length > 0){
         $('.tabulatr_mark_all[data-table='+ tableId +']').prop("indeterminate", true);
@@ -352,7 +402,7 @@ $(document).on('ready page:load', function(){
       }else{
         $('.tabulatr_mark_all[data-table='+ tableId +']').prop('indeterminate', false);
         $('.tabulatr_mark_all[data-table='+ tableId +']').prop('checked', false);
-        if(Tabulatr.checkIfCheckboxesAreMarked()){
+        if(table_obj.checkIfCheckboxesAreMarked()){
           $('#'+ tableId +' .tabulatr-wrench').removeClass('disabled');
         }else{
           $('#'+ tableId +' .tabulatr-wrench').addClass('disabled');
@@ -366,17 +416,23 @@ $(document).on('ready page:load', function(){
     $(this).closest('div').find('a').removeClass('active');
     $(this).addClass('active');
     var tableId = $(this).closest('div').data('table');
-    Tabulatr.moreResults = true;
-    if($('.pagination[data-table='+ tableId +']').length == 0){
+    var table_obj = undefined;
+    for(var i = 0; i < tabulatr_tables.length; i++){
+      if(tabulatr_tables[i].id == tableId){
+        table_obj = tabulatr_tables[i];
+      }
+    }
+    table_obj.moreResults = true;
+    if($('.pagination[data-table='+ tableId +']').length === 0){
       $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
     }
     if(typeof(Storage) !== undefined){
       localStorage.tabulatr_page_display_count = $(this).data('items-per-page');
     }
-    Tabulatr.updateTable({page: 1}, tableId, true);
+    table_obj.updateTable({page: 1}, true);
   });
 
-  if($('.tabulatr_table').length > 0){
+  if($('.tabulatr_table:not(".tabulatr_static_table")').length > 0){
     if(typeof(Storage) !== undefined){
       var count = localStorage.tabulatr_page_display_count;
       if(count !== undefined){
@@ -385,8 +441,16 @@ $(document).on('ready page:load', function(){
           addClass('active');
       }
     }
-    $('.tabulatr_table').each(function(ix, el){
-      Tabulatr.updateTable({}, $(el).attr('id'));
+    var table_obj = undefined;
+    $('.tabulatr_table:not(".tabulatr_static_table")').each(function(ix, el){
+      var tableId = $(el).attr('id');
+      tabulatr_tables.push(new Tabulatr(tableId));
+      for(var i = 0; i < tabulatr_tables.length; i++){
+        if(tabulatr_tables[i].id == tableId){
+          table_obj = tabulatr_tables[i];
+        }
+      }
+      table_obj.updateTable({});
     });
   }
 });
@@ -400,7 +464,13 @@ $(document).on('click', '.pagination a', function(){
   var tableId = $(a).closest('.pagination').data('table');
   $('.tabulatr_mark_all[data-table='+ tableId +']').prop('checked', false);
   $('.tabulatr_mark_all[data-table='+ tableId +']').prop('indeterminate', false);
-  Tabulatr.updateTable({append: false, page: a.data('page')}, tableId);
+  var table_obj = undefined;
+  for(var i = 0; i < tabulatr_tables.length; i++){
+    if(tabulatr_tables[i].id == tableId){
+      table_obj = tabulatr_tables[i];
+    }
+  }
+  table_obj.updateTable({append: false, page: a.data('page')});
   return false;
 });
 
@@ -409,13 +479,13 @@ $(document).on('click', '.pagination a', function(){
 
 $(document).on('click', 'a[data-show-table-filter]', function(){
   var a = $(this);
-  var nam = a.data('show-table-filter');
-  $('div[data-filter-column-name="'+nam+'"]').show('blind');
+  var name = a.data('show-table-filter');
+  $('div[data-filter-column-name="'+ name +'"]').show('blind');
   $('div[data-filter-column-name="_submit"]').show('blind');
 
   a.hide();
   return false;
-})
+});
 
 $(document).on('click', 'a[data-hide-table-filter]', function(){
   var a = $(this);
@@ -428,9 +498,15 @@ $(document).on('click', 'a[data-hide-table-filter]', function(){
     $('div[data-filter-column-name="_submit"]').hide('blind');
 
   var tableId = $(this).parents('form').data('table');
-  Tabulatr.submitFilterForm(tableId);
+  var table_obj = undefined;
+  for(var i = 0; i < tabulatr_tables.length; i++){
+    if(tabulatr_tables[i].id == tableId){
+      table_obj = tabulatr_tables[i];
+    }
+  }
+  table_obj.submitFilterForm();
   return false;
-})
+});
 
 $(document).on('change', 'select[data-tabulatr-date-filter]', function() {
   var select = $(this);
@@ -452,7 +528,14 @@ var cbfn = function(event, isInView, visiblePartX, visiblePartY) {
     } else if (visiblePartY == 'bottom') {
       // bottom part of element is visible
     } else {
-      Tabulatr.updateTable({append: true}, $(event.currentTarget).data('table'));
+      var tableId = $(event.currentTarget).data('table');
+      var table_obj = undefined;
+      for(var i = 0; i < tabulatr_tables.length; i++){
+        if(tabulatr_tables[i].id == tableId){
+          table_obj = tabulatr_tables[i];
+        }
+      }
+      table_obj.updateTable({append: true});
     }
   }
-};
+};