Использование tablekit для сортировки таблицы, которая возвращается из метода AJAX

Question

Я возвращаю набор результатов от вызова Ajax, как так

<g:submitToRemote update="updateMe" action="getParams" asynchronus="false" value="Search" name="SearchButton" type="hidden"/> 

Это ставит результаты этого вызова в теге updateMe DIV.

Теперь я на самом деле отображения таблицы из моего контроллера, как это:

render(view: 'ajaxResults', model:[results:resultRows]) 

где ajaxResults шаблон, который выглядит следующим образом:

 <div class="list"> 
      <h1>Query Results</h1> 
      <table style="width: 80%; align: center;" class="sortable resizable"> 
       <thead> 
        <tr>      
         <th id="emp_name" class="sortfirstasc">Employee Name</th> 
         <th id="title">Title</th> 
         <th id="labor_grade">Labor Grade</th> 
         <th id="name">Hit</th> 
         <th id="total_exp">Experience (Yrs)</th>      
        </tr> 
       </thead> 
       <tbody> 
        <g:each in="${results}" status="i" var="search"> 
         <tr>      
          <td><g:link controller="employee" action="edit" id="${search.id}">${search.emp_name?.encodeAsHTML()}</g:link></td>        
          <td>${search.title?.encodeAsHTML()}</td> 
          <td>${search.labor_grade?.encodeAsHTML()}</td> 
          <td>${search.name?.encodeAsHTML()}</td> 
          <td>${search.total_exp?.encodeAsHTML()}</td>                     
         </tr> 
        </g:each> 
       </tbody> 


      </table> 
     </div> 
     <div class="paginateButtons"> 
      <g:paginate total="${Search.count()}" /> 
     </div> 
    </div> 

Проблема заключается в том - эта таблица не на самом деле сортировка. Я пытаюсь использовать tablekit

<link rel="stylesheet" type="text/css" media="all" href="../css/tablekit.css" />   
<g:javascript library="tablekit"></g:javascript> 

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

Answer 1

Предположительно, tablekit выполняет действие на загрузке страницы, которое находит декорированные элементы и применяет методы JavaScripts.

Используйте параметр after или событие onComplete на теге submitToRemote, чтобы вызвать функцию JavaScript для повторного применения поведения сортировки.

Что-то вдоль линий:

<g:submitToRemote ... after="reapplySortable"> 

и в JS

<script> 
    function reapplySortable() { 
    TableKit.Sortable.init(table, {options}); 
    } 
</script> 

Answer 2

Я тоже искал это на Google и везде, но ничего не нашел ... , но это было смешно, когда я нашел ответ на часто задаваемые вопросы веб-сайта tablekit после обширного поиска в другом месте !! Есть только два часто задаваемых вопроса, а второй - тот, который ищут большинство людей, таких как я. visit для получения полной информации. Он говорит:

TableKit.reloadTable(tablename); 

заставить TableKit повторную инициализацию.

Надеюсь, это поможет.