Просто добавленные данные удаляются при сортировке таблицы

Когда я пытаюсь сортировать строки в таблице ниже, нажав кнопку добавления, почему добавленные данные удаляются из таблицы?Просто добавленные данные удаляются при сортировке таблицы

Пробег: http://jsfiddle.net/fXAbh/ Нажмите «Добавить», а затем попытайтесь отсортировать строку, щелкнув заголовок столбца, добавленная строка исчезнет, мне нужны только что добавленные данные, которые также будут сортироваться и не удаляться.

<!DOCTYPE html> 
<html> 
<head> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
<script src="http://tablesorter.com/__jquery.tablesorter.js" type="text/javascript"></script> 
<script src="http://tablesorter.com/addons/pager/jquery.tablesorter.pager.js" type="text/javascript"></script> 
<link rel="stylesheet" href="http://tablesorter.com/themes/blue/style.css" type="text/css" media="print, projection, screen" /> 

    <script type="text/javascript"> 
    $(document).ready(function() { 
       { 
        $("#myTable").tablesorter({widthFixed: true, widgets: ['zebra']}).tablesorterPager({container: $("#pager")}); 
        $("#pager").css('top','auto'); 
       } 
    }); 

    function append() { 
     $('#myTable > tbody:last').prepend('<tr><td>test</td><td></td><td></td><td></td><td></td><td></td><td></td></tr>'); 
     }; 

    </script> 

</head> 


<body> 
<input type="button" value="Append" onclick="append();" /> 
<table id="myTable" cellspacing="1" class="tablesorter"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>Major</th> 
      <th>Sex</th> 
      <th>English</th> 
      <th>Japanese</th> 
      <th>Calculus</th> 
      <th>Geometry</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>Student01</td> 
      <td>Languages</td> 
      <td>male</td> 
      <td>80</td> 
      <td>70</td> 
      <td>75</td> 
      <td>80</td> 
     </tr> 
     <tr> 
      <td>AStudent01</td> 
      <td>Languages</td> 
      <td>male</td> 
      <td>80</td> 
      <td>70</td> 
      <td>75</td> 
      <td>80</td> 
     </tr> 
</tbody> 
</table> 

<div id="pager" class="pager"> 
    <form> 
     <input type="text" class="pagedisplay"/> 
     <select class="pagesize"> 
      <option selected="selected" value="10">10</option> 
      <option value="20">20</option> 
      <option value="30">30</option> 
      <option value="40">40</option> 
     </select> 
    </form> 
</div> 



</body> 
</html>

источник

2012-03-02 blue-sky

1k + пользователь и вы не знаете, что вам не нужно размещать весь HTML страницы? (-_-) sighhhhhhhh – Starx

После добавления новой строки, вы должны инициировать событие обновления на столе. Так что плагин знает, что он должен обновлять свои данные, которые используются для повторной привязки таблицы к сортировке.

$("#myTable").trigger("update");

Работа демо - http://jsfiddle.net/ShankarSangoli/fXAbh/2/

источник

2012-03-02 19:17:08 ShankarSangoli

Вам нужно позвонить $("#myTable").trigger("update"); после каждого обновления, которая позволит плагин знать, что есть обновление.

DEMO

источник

2012-03-02 19:16:54

Просто добавленные данные удаляются при сортировке таблицы

ответ

Смежные вопросы