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

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

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

Я возвращаю набор результатов от вызова 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>

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

Ответы [ 2 ]

2 голосов
/ 11 августа 2012

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

TableKit.reloadTable(tablename);

для принудительной повторной инициализации TableKit.

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

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

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

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

Что-то вроде: 

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

и в js 

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