如果表中没有数据,如何禁用jquery tablesorter?

时间:2013-06-26 05:37:13

标签: jquery tablesorter

如果我的数据中没有数据,我会收到此错误:

Uncaught TypeError: Cannot read property 'rows' of undefined 

如果表中没有数据,如何禁用表分类器:

我正在使用tablesorter这样:

    $(document).ready(function() { 
        $("table").tablesorter(); 
            // set sorting column and direction, this will sort on the first and third column the column index starts at zero 
            var sorting = [[0,0],[2,0]]; 
            // sort on the first column 
            $("table").trigger("sorton",[sorting]); 
            // return false to stop default link action 
            return false; 
    });

表格如下:

<table border="0" width="100%" cellpadding="0" cellspacing="0" id="product-table" class="tablesorter">
            <thead>
            <tr>
              <th width="5%" class="table-header-left"><a href=""><span></span></a></th>
              <th width="25%" class="table-header-repeat line-left"><a href=""><span>File Name</span></a></th>
              <th width="15%" class="table-header-repeat line-left"><a href=""><span>Type</span></a></th>
              <th width="15%" class="table-header-repeat line-left"><a href=""><span>Size</span></a></th>
              <th width="20%" class="table-header-repeat line-left"><a href=""><span>Date Updated</span></a></th>
              <th width="20%" class="table-header-options line-left"><a href=""><span>Source</span></a></th>
            </tr>
            </thead>
            {% csrf_token %}
              {% load endless %}
              {% paginate limit files %}
              {{ endless_pagination.utils.get_elastic_page_numbers }}

              {% for choice in files %}
              <tr>
                <td><input type="checkbox" name="choice" id="choice{{ forloop.counter }}" value="{{ choice.id }}" /></td>
                <td><label for="choice{{ forloop.counter }}">{{ choice.file_name }}</label></td>
                <td>{{ choice.type }}</td>
                <td>{{ choice.size }}</td>
                <td>{{ choice.end_date }}</td>
                <td>{{ choice.source }}</td>
              </tr>
              {% endfor %}

          </table>

2 个答案:

答案 0 :(得分:2)

试试这个,

$(function(){
    if ($("table").find("tr").length > 1)
    {
        $("table").tablesorter(); 
        // set sorting column and direction, this will sort on the first and third column the column index starts at zero 
        var sorting = [[0,0],[2,0]]; 
        // sort on the first column 
        $("table").trigger("sorton",[sorting]); 
        // return false to stop default link action 
        return false;
    } 
});

答案 1 :(得分:0)

如果您使用的是this fork of tablesorter,请尝试this demoref)中的代码。

var minRows = 3, // Minimum number of rows needed before tablesorter allows sorting

  $t = $('table'),

  // check number of rows; enable or disable sorting
  checkRows = function () {
    // check number of rows
    var min = $t.find('tbody tr').length < minRows;
    // go through each header and enable/disable as needed
    $t[0].config.$headers.each(function (i) {
      // only enable/disable certain columns (ignore 5th column, it's always disabled)
      if (i < 4) {
        // disable sort per column
        this.sortDisabled = min;
        // add sorter-false class to hide controls
        $(this).toggleClass('sorter-false', min);
      }
    });
  };

$t
  // check number of rows after initialization & updates
  .on('tablesorter-initialized updateComplete', checkRows)
  // initialize tablesorter
  .tablesorter({
    theme: 'blue',
    widgets: ['zebra', 'columns']
  });