Блог

что я хочу, чтобы моя функция выполняла:

на первой странице «Отображается от 1 до 7 из 11 результатов»

вторая страница «Отображение результатов от 7 до 11 из 11»

и т.д.

переменные, которые у меня есть:

страница — на какой странице вы находитесь (1,2,3…)

records_per_page — сколько результатов отображается на странице (7)

objJson.length — сколько существует результатов

NumPages() — вычисляет количество страниц

Моя текущая функция показывает:

результат на первой странице — «Отображение от 1 до 7 из 11»

результат на второй странице — «Показано от 2 до 14 из 11»

 let changePage = function(page) {
               const listingTable = document.getElementById('listingTable');
     
               if (page < 1) {
                   page = 1;
               } 
               if (page > (numPages() -1)) {
                   page = numPages();
               }

               listingTable.innerHTML = "";

     
               for(let i = (page -1) * records_per_page; i < (page * records_per_page) amp;amp; i < objJson.length; i  ) {
                    let dataTable = document.getElementById("dataTable_info")
                    .innerHTML = `Showing ${page} to ${(page) * records_per_page} of ${objJson.length}`;
                    console.log(i)
                    

                    const tr = document.createElement("tr");

                   const content = `
                   <td>${objJson[i]._id}</td>
                   <td>${objJson[i].firstName}</td>
                   <td>${objJson[i].email}</td>
                   <td>${objJson[i].role}</td>
                   <td>${objJson[i].createdAt.slice(0, 10)}</td>
                   <td>${objJson[i].updatedAt.slice(0, 10)}</td>`;
                   
                   tr.innerHTML = content;
                   listingTable.appendChild(tr);
               }
               checkButtonOpacity();
               selectedPage();
               
           }
 

Вы можете использовать эту логику.

 function f(currentPage, totalPage) {
    const pageCount = 1;
    let pages = '',
        firstVisiblePage = currentPage <= pageCount ? 1 : currentPage - pageCount,
        lastVisiblePage = totalPage - currentPage <= pageCount ? totalPage : currentPage   pageCount;

    if (firstVisiblePage > 1) {
        pages  = `<li><a href="#" data-page="1">1</a>`;
        pages  = `<li><a href="#">...</a>`;
    }

    for (let i = firstVisiblePage; i <= lastVisiblePage; i  ) {
        const page = i,
            className = currentPage === page ? "current" : "";

        pages  = `<li><a class="${className}" href="#" data-page="${page}">${page}</a>`;
    }

    if (totalPage - currentPage > pageCount) {
        pages  = `<li><a href="#">...</a>`;
    }

    if (lastVisiblePage < totalPage) {
        pages  = `<li><a href="#" data-page="${totalPage}">${totalPage}</a>`
    }

    const nextPage = currentPage < totalPage ? currentPage   1 : -1;
    const prevPage = currentPage > 1 ? currentPage - 1 : -1;

    return `
        <nav data-pagination>
            <a id="prevPage" class="btn-page-control" href="#" data-page="${prevPage}"><i class=ion-chevron-left>amp;laquo;</i></a>
            <ul class="pages-ul">
                ${pages}
            </ul>
            <a id="nextPage" class="btn-page-control" href="#" data-page="${nextPage}"><i class=ion-chevron-right>amp;raquo;</i></a>
        </nav>`;
}