#jquery #jquery-plugins #tablesorter
#jquery #jquery-плагины #сортировщик таблиц #tablesorter
Вопрос:
Я использую http://tablesorter.com/docs / чтобы попытаться отсортировать таблицу. Это работает с косметической проблемой, которая не так сильно беспокоит. «Зебра» не активируется, пока вы действительно не попытаетесь упорядочить таблицу. Совсем не раздражает, но я не мог найти, почему это происходит.
Моя настоящая проблема в том, что я пытаюсь также использовать плагин pager. Div-файл пейджера отображается в верхней части страницы. Это может быть вызвано (обе проблемы) тем, что при первом появлении таблица находится внутри предыдущей скрытой вкладки. Содержимое загружается из PHP-файла через AJAX, и при загрузке, в зависимости от данных, я мог бы активировать вкладки и tablesorter (или нет). Если я это сделаю, я сделаю с этими строками кода:
(".tab_content").hide();
$("ul.tabs li:first").addClass("active").show();
$(".tab_content:first").show();
$("#calls").tablesorter({widthFixed: true, widgets: ['zebra']}).tablesorterPager({container: $("#pager")});
Div «пейджер» находится внутри вкладки, чуть ниже целевой таблицы.
Поскольку @mu должен сообщить, что пейджер должен знать, где находится таблица.
Вкладки загружаются с
<ul class="tabs">
<li><a href="#cont-standard-report">Standard</a></li>
<li><a href="#cont-extensions-report">Extensions</a></li>
<li><a id="calls" href="#cont-calling-report">Callings</a></li>
</ul>
Итак, я попробовал с предлагаемой функцией, но она даже не вызывает ее при нажатии на вкладку.
$("#cont-calling-report").one('click', function() {
alert ("Test");
$("#calls").tablesorter({widthFixed: true, widgets: ['zebra']})
.tablesorterPager({container: $("#pager")});
});
Вот что происходит. Щелчок не требуется.
Удалось решить с помощью этого
Удалось решить это с помощью этого:
if (activeTab == '#cont-callings-report' amp;amp; !tablesorter){
$("#calls").tablesorter({widthFixed: true, widgets: ['zebra']}).tablesorterPager({container: $("#pager")});
tablesorter = 1;
}
Внутри функции табуляции.
Ответ №1:
Вероятно, плагину pager необходимо знать, где находится таблица и насколько она велика, прежде чем он сможет правильно себя позиционировать. Когда ваша вкладка скрыта, таблица внутри нее не имеет полезной позиции, поэтому в пейджере, вероятно, в конечном итоге отображаются нули для нужной позиции, и результатом является пейджер в верхней части страницы. Самым простым решением было бы привязать tablesorter
при нажатии на вкладку:
$(selector_for_the_tab_with_the_table).one('click', function() {
$("#calls")
.tablesorter({widthFixed: true, widgets: ['zebra']})
.tablesorterPager({container: $("#pager")});
});
Вам нужно привязать его только один раз, поэтому используйте .one
:
Этот метод идентичен
.bind()
, за исключением того, что обработчик не привязан после его первого вызова.
Комментарии:
1. Привет, то, что вы предлагаете, кажется, в правильном направлении, это то, о чем я не подумал, но, похоже, это не вызов функции…
2. @Antonio: Вы используете правильную вещь вместо «selector_for_the_tab_with_the_table»? Я не знаю, как выглядит ваш HTML-код, поэтому я использовал заполнитель.
3. @Antonio: Просто удостоверяюсь 🙂 Попробуйте привязать
.one()
к<li>
, а не к<a>
. Вкладки, вероятно, являются обработчиками привязки к элементам списка, и они не позволили бы щелчку перейти к<a>
.4. Ладно, я придурок. Я привязывался к полю идентификатора, которого не было. Как только я добавляю идентификатор в li или в add, он вызывает функцию, но происходят две вещи: 1. — Она ничего не показывает 2. — Сама вкладка отображается неправильно.
5. @Antonio: Я
href
тоже смотрел, даже не заметил отсутствияid
. Какой плагин tabs вы используете? Есть ли шанс, что вы могли бы настроить демо на jsfiddle.net ?