Разбивка на страницы с динамическим удалением строк — обновление ссылок на страницы и отображаемых строкCSS

Разбираемся в CSS
Ответить Пред. темаСлед. тема
Anonymous
 Разбивка на страницы с динамическим удалением строк — обновление ссылок на страницы и отображаемых строк

Сообщение Anonymous »

Я реализовал функцию нумерации страниц в таблице на своей HTML-странице. На каждой странице должно отображаться три строки, а всего в моей таблице восемь строк. Кроме того, у меня есть кнопка, которая удаляет строки с помощью класса «remove_tr». При нажатии этой кнопки я хочу, чтобы соответствующие строки были удалены, а нумерация страниц соответствующим образом обновлена.
Проблема, с которой я столкнулся, заключается в том, что когда я удаляю строки с помощью команды "remove_tr", ", затрагиваются только строки на первой странице. Ссылки на страницы и отображаемые строки не обновляются правильно, и в результате у меня появляется две страницы вместо трех. Мне нужна помощь в изменении существующего кода, чтобы обеспечить правильное обновление нумерации страниц при удалении строк, чтобы на каждой странице последовательно отображались три строки.
//HTML-код

Код: Выделить всё

    remove




ALARM_DESC



ALARM_NAME



APPLICAITON



ALARM_PATH






first desc
first name
first app
first path



Second desc
Second name
second app
second path




third desc
third name
third app
third path



four desc
four name
four app
four path



fifth desc
fifth name
fifth app
fifth path



six desc
six name
six app
six path




//css-код

Код: Выделить всё

        .pagination {
display: flex;
justify-content: center;
margin-top: 20px;
}

.pagination a {
margin: 0 5px;
padding: 5px 10px;
background-color: #f2f2f2;
color: #333;
text-decoration: none;
border-radius: 3px;
}

.pagination a.active {
background-color: #4CAF50;
color: white;
}
//код jquery

Код: Выделить всё

  $(document).ready(function() {
add_pagination();
});

function add_pagination() {
var rowsPerPage = 3;
var $table = $('#data-table');
var $tbody = $table.find('tbody');
var $rows = $tbody.find('tr');
var totalRows = $rows.length;
var totalPages = Math.ceil(totalRows / rowsPerPage);
var $pagination = $('.pagination');

var $pagination = $(''); // إنشاء عنصر الترقيم
$table.after($pagination);

for (var i = 1; i 

Подробнее здесь: [url]https://stackoverflow.com/questions/78715800/pagination-with-dynamic-row-removal-updating-pagination-links-and-displayed-ro[/url]
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «CSS»