如何使用 codeigniter 4 中的寻呼机库对 ajax 进行分页

Question

大家好，我正在使用 CI4 Pager 库创建 ajax 分页，但我发现很难捕捉到分页计数器的 ID。而不是使用完整的 URI 路径 “localhost/view-user/?page=1”，我只想捕获“1”，这样我就可以使用 javascript 作为 post 变量传递它这将允许我在 paginate 方法内部路径作为参数，如下所示（paginate(5, 'test', $page = 1)）。我怎样才能做到这一点并让它与 ajax 一起工作？

//html分页链接

    <nav aria-label="<?= lang('Pager.pageNavigation') ?>">
        <ul class="pagination">
            <?php foreach ($pager->links() as $link) : ?>
                <li <?= $link['active'] ? 'class="active"' : '' ?>>
                    <a href="<?= $link['uri'] ?>">
                        <?= $link['title'] ?>
                    </a>
                </li>
            <?php endforeach ?>
        </ul>
    </nav>

    //dataset like this inside anchor tag "data-page" 
     where the counter variable it will be an integer 
    
    <a href="<?= $link['uri'] ?>" data-page="<?= $counter ?>"></a>

// 我的控制器

    public function view(){
        if ($this->request->isAJAX()) {
            $page = $this->request->getPost('page');

            $result = $this->model->getKanda()->paginate(20,'default',$page);
            $pager = $this->model->pager;
            $output = array();
            foreach($result as $row){
                $output[] = [
                     'id' => $row['userid'],
                     'username' => $row['username'],
                ];
            }

            $json = [
                'result'=> $output, 
                'pager' => $pager->links(),
            ];
            return $this->response->setJSON($json);
        }
    }

我的 js

    $(document).on('click', 'ul.pagination li a', function(e){
         e.preventDefault();
         let page = $(this).data('page');
          viewUser(page);
    });

    function viewUser(page){
       let ajax   = $.ajax({
                       url: 'view-user',
                       method:'post',
                       data: { page: page },
                       dataType: 'json',
                    });

       ajax.done(function(data){
              let html = '';
              $.each(data.result, function(k, v){
                   let dataSet = `
                            data-id='${v.id}' 
                            data-kanda='${v.username}' 
                     `;
                   html += `<div>${v.username}</div>`;
              });
              $('.result').html(html);
              $('.paginator').html(data.pager);
       });
    }

Answer 1

我决定在 Codeigniter4\framework\system\Pager\PageRenderer.php 中添加额外的方法。因此，当想要在分页锚标记内设置数据属性时，它会有所帮助，即。

 <a href="" data-page="<?= $pager->getFirstPageCounter() ?>"> <?= $pager->getFirst() ?>

// pageRenderer.php

    <?php 
     
    /**
     * vena add counter methods 2021
     */
     
    // Get First Page Number 
    public function getFirstPageCounter(): int
    {
        if ($this->segment === 0){
            $firstPage = 1;
        }else{
            $firstPage = $this->segment;
        }
     
        return (int) $firstPage;
    }
     
    // get Last page Number
    public function getLastPageCounter()
    {
        if ($this->segment === 0){
            $last = $this->pageCount;
        }else{
            $last = $this->segment;
        }
        return (int)$last;
    }
     
    // Get previous Page number
    public function getPreviousPageCounter()
    {
        if (! $this->hasPrevious()){
            return null;
        }
     
        if ($this->segment === 0){
            $previous = $this->first - 1;
        }else{
            $previous = $this->segment;
        }
     
        return (int) $previous;
    }
     
    // get Next Page Number
    public function getNextPageCounter()
    {
        if (! $this->hasNext()){
            return null;
        }
     
        if ($this->segment === 0){
            $next = $this->last + 1;
        }else{
            $next = $this->last + 1;
        }
        return (int) $next;
    }

Pager\Views\default_full.php

        <?php
         \CodeIgniter\Pager\PagerRenderer $pager
         
        $pager->setSurroundCount(2);
        ?>
         
        <nav aria-label="<?= lang('Pager.pageNavigation') ?>">
            <ul class="pagination">
                <?php if ($pager->hasPrevious()) : ?>
                    <li>
                        <a href="<?= $pager->getFirst() ?>" aria-label="<?= lang('Pager.first') ?>" data-page="<?= $pager->getFirstPageCounter() ?>"> <span aria-hidden="true"><?= lang('Pager.first') ?></span></a>
                    </li>
                    <li>
                        <a href="<?= $pager->getPrevious() ?>" aria-label="<?= lang('Pager.previous') ?>" data-page="<?= $pager->getPreviousPageCounter() ?>"> <span aria-hidden="true"><?= lang('Pager.previous') ?></span> </a>
                    </li>
                <?php endif ?>
         
                <?php foreach ($pager->links() as $link) : ?>
                    <li <?= $link['active'] ? 'class="active"' : '' ?>>
                        <a href="<?= $link['uri'] ?>" data-page="<?= $link['title'] ?>"> <?= $link['title'] ?> </a>
                    </li>
                <?php endforeach ?>
         
                <?php if ($pager->hasNext()) : ?>
                    <li>
                        <a href="<?= $pager->getNext() ?>" aria-label="<?= lang('Pager.next') ?>" data-page="<?= $pager->getNextPageCounter() ?>"> <span aria-hidden="true"><?= lang('Pager.next') ?></span></a>
                    </li>
                    <li>
                        <a href="<?= $pager->getLast() ?>" aria-label="<?= lang('Pager.last') ?>" data-page="<?= $pager->getLastPageCounter() ?>"> <span aria-hidden="true"><?= lang('Pager.last') ?></span></a>
                    </li>
                <?php endif ?>
            </ul>
        </nav>

如何使用 codeigniter 4 中的寻呼机库对 ajax 进行分页

How to paginate with ajax using pager library in codeigniter 4

php

ajax

codeigniter

codeigniter-4