Проблема jQuery tableorter только в Firefox - строка заголовка исчезает после скрытия строк - PullRequest
0 голосов
/ 25 декабря 2010

Когда страница загружается, отображаются все записи. Сортировка работает отлично, пока show-hide не используется для фильтрации строк, поэтому только некоторые шоу. Затем строка заголовка - со стрелками для сортировки - исчезает. Проблема только в Firefox. Отлично работает в IE7 и IE8.

Я использую jQuery 1.4.2 от Google.

Код для шоу-скрытия

$(document).ready(function() {
    // show all the rows
    $("#org_status tr").show();

    //find selected filter
    $("#filter_status a").click(function(evt) {
        evt.preventDefault();
        $("#org_status tr").hide();
        var id = $(this).attr('id');

        $("." + id).show();
    });
});

Вот HTML:

<!-- show-hide "buttons" -->
<p id='filter_status'>Filter by status: 
    <a href='#' id='All'>All</a> 
    <a href='#' id='Active'>Active</a> 
    <a href='#' id='Inactive'>Inactive</a> 
    <a href='#' id='Pending'>Pending</a>
</p>

<!-- table to sort ->
<table id='org_status' class='info_table tablesorter'>
  <thead>
    <tr>
      <th class='org-name-col'>Name</th>
      <th class='org-status-col'>Status</th>
    </tr>
  </thead>
  <tbody>
<tr class='All Active'>
  <td><a href='admin/org_edit.php?org=29'>Foo Net</a></td>
  <td>Active</td>";
</tr>
<tr class='All Inactive'>
  <td><a href='admin/org_edit.php?org=22'>Bar</a></td>
  <td>Active</td>";
</tr>
<tr class='All Pending'>
  <td><a href='admin/org_edit.php?org=11'>
      Bar Foo Very Long Org Name Goes Here</a></td>
  <td>Active</td>";
</tr>
  </tbody>  
</table>    

1 Ответ

1 голос
/ 25 декабря 2010

Я не думаю, что это просто проблема для Firefox, потому что строка заголовка сначала создается, чтобы скрыть, а код де не показывается позже.Попробуйте изменить код следующим образом: Javascript:

$(document).ready(function() {
    // show all the rows
    $("#org_status tr").show();

    //find selected filter
    $("#filter_status a").click(function(evt) {
        evt.preventDefault();
        $("#org_status tr").hide();
        var id = $(this).attr('id');

        $("." + id).show();
    $(".showAlways").show();
    });
});

HTML:

<p id='filter_status'>Filter by status: 
    <a href='#' id='All'>All</a> 
    <a href='#' id='Active'>Active</a> 
    <a href='#' id='Inactive'>Inactive</a> 
    <a href='#' id='Pending'>Pending</a>
</p>

<table id='org_status' class='info_table tablesorter'>
  <thead>
    <tr  class="showAlways">
      <th class='org-name-col'>Name</th>
      <th class='org-status-col'>Status</th>
    </tr>
  </thead>
  <tbody>
<tr class='All Active'>
  <td><a href='admin/org_edit.php?org=29'>Foo Net</a></td>
  <td>Active</td>";
</tr>
<tr class='All Inactive'>
  <td><a href='admin/org_edit.php?org=22'>Bar</a></td>
  <td>Active</td>";
</tr>
<tr class='All Pending'>
  <td><a href='admin/org_edit.php?org=11'>
      Bar Foo Very Long Org Name Goes Here</a></td>
  <td>Active</td>";
</tr>
  </tbody>  
</table>    
...