Плагин jQuery TableSorter не работает после вызова AJAX - PullRequest
Новая
       32

Плагин jQuery TableSorter не работает после вызова AJAX

3 голосов
/ 09 июля 2010

Я использовал плагин сортировки таблиц jQuery в своем коде. Это работает нормально, пока я не делаю ajax-запрос для динамической загрузки данных таблицы. Я использую поля со списком для фильтрации содержимого таблицы по AJAX. Я прочитал несколько постов, в которых говорится, что $("table").trigger("update"); может решить мою проблему. Я попробовал это с моим кодом, но проблема все еще там.

Есть ли другой способ решить эту проблему? Пожалуйста, помогите мне найти решение. Я действительно плохо себя чувствую. Любая помощь будет оценена. Ниже мой код: 

$(document).ready(function () {
    $("#myTable").tablesorter({
        widthFixed: true,
        widgets: ['zebra'],
        headers: {
            0: {
                sorter: false
            }
        }
    }).tablesorterPager({
        container: $("#pager")
    });

    $("#tag").change(function (event) {
        $('#myTable').trigger("update");
        $("#myTable").tablesorter();
    });
});

Здесь tag - это идентификатор поля со списком с именем tag, а myTable - это идентификатор таблицы с плагином сортировщика.

Ответы [ 6 ]

1 голос
/ 12 октября 2010

Я бы обернул функцию tableorter в ее собственную функцию.

Затем, когда вам нужно будет запустить ее - просто вызовите ее снова. 

$(document).ready(function () {
    function resortTable(){ 
          $("#myTable").tablesorter({
            widthFixed: true,
            widgets: ['zebra'],
            headers: {
                0: {
                    sorter: false
                }
            }
        }).tablesorterPager({
            container: $("#pager")
        });
    }

        $("#tag").change(function() {
            resortTable();
        });
});
1 голос
/ 21 сентября 2010

Новые элементы DOM не привязаны к событиям JavaScript. jQuery решает аналогичную проблему, используя свою «живую» функцию. После завершения вызова AJAX перезапустите JavaScript в document.ready ().

1 голос
/ 28 июля 2010

Неясно, какой механизм вы используете для вызова AJAX, но если это ASP.NET UpdatePanel, вам нужно будет повторно привязать события jQuery после завершения вызова AJAX.

Добавьте следующее в ваш скрипт 

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(function(sender, args) {
    // Code to rebind your UI
});

Примечание: работает только при использовании ASP.NET AJAX

0 голосов
/ 22 ноября 2014

Я знаю, что это старый пост, но, возможно, мой ответ поможет кому-то еще найти эту проблему.Я исправил эту проблему, снова вызвав 

$('#myTable').tablesorter();

сразу после моего вызова AJAX.

0 голосов
/ 12 октября 2010

Я бы хотел использовать плагин livequery для этого ... он творит чудеса

http://docs.jquery.com/Plugins/livequery

0 голосов
/ 02 августа 2010

Проблема в том, что вы вызываете код $('#myTable').trigger("update");, когда меняется поле со списком, а не когда вы получаете ответ на ваш запрос AJAX.Если вы используете ASP.NET AJAX, попробуйте опубликовать код ericphan .Если вы используете jQuery AJAX, попробуйте что-то вроде этого: 

$.get('http://site.com/request-address', function(data) {

    // Code you're using to replace the contents of the table

    // Code to rebind the tablesorter
    $('#myTable').trigger("update");
    $("#myTable").tablesorter();
});

Таким образом, вы привязываете сортировщик таблиц к новому содержимому таблицы, а не к старому содержимому, которое должно быть заменено.

...