Solving Compatibility Issues between jasongrimes/paginator Pagination Component and Bootstrap 4 in webman

Publish: 2023-06-18 | Modify: 2023-06-18

webman is a high-performance HTTP service framework based on Workerman. It is used to replace the traditional php-fpm architecture and provides highly scalable HTTP services. You can use webman to develop websites, as well as HTTP interfaces or microservices.

76b11b5e7fd82ef5.png

Using jasongrimes/paginator Pagination Component in webman

webman pagination uses the following 2 PHP components:

  • illuminate/pagination
  • jasongrimes/paginator:~1.0

The official webman documentation: https://www.workerman.net/doc/webman/db/paginator.html provides detailed usage instructions. However, the official documentation's pagination method is only applicable to Bootstrap 3 and has compatibility issues with Bootstrap 4.

Resolving Compatibility Issues between jasongrimes/paginator Pagination Component and Bootstrap 4

The jasongrimes/paginator PHP component is no longer maintained by its author, which leads to incompatibility with Bootstrap 4 and pagination style issues.

The solution is to modify the vendor/jasongrimes/paginator/src/JasonGrimes/Paginator.php file. Find the toHtml() function and modify it as follows:

/**
     * Render an HTML pagination control.
     *
     * @return string
     */
    public function toHtml()
    {
        if ($this->numPages <= 1) {
            return '';
        }

        $html = '<ul class="pagination">';
        if ($this->getPrevUrl()) {
            $html .= '<li class="page-item"><a class="page-link" href="' . htmlspecialchars($this->getPrevUrl()) . '">&laquo; '. $this->previousText .'</a></li>';
        }

        foreach ($this->getPages() as $page) {
            if ($page['url']) {
                $html .= '<li' . ($page['isCurrent'] ? ' class="active page-item"' : '') . '><a class="page-link" href="' . htmlspecialchars($page['url']) . '">' . htmlspecialchars($page['num']) . '</a></li>';
            } else {
                $html .= '<li class="disabled page-item"><span class="page-link">' . htmlspecialchars($page['num']) . '</span></li>';
            }
        }

        if ($this->getNextUrl()) {
            $html .= '<li class="page-item"><a class="page-link" href="' . htmlspecialchars($this->getNextUrl()) . '">'. $this->nextText .' &raquo;</a></li>';
        }
        $html .= '</ul>';

        return $html;
    }

After making this modification, the pagination style will be displayed correctly, as shown below:

3793d80d353f7fc3.png

Limiting the Number of Pages Displayed in jasongrimes/paginator

On mobile devices, due to limited width, you may find that the jasongrimes/paginator component extends beyond the screen width. You can simply call the following function:

$paginator->setMaxPagesToShow(3);

This article references the following source: https://github.com/jasongrimes/php-paginator/issues/17


Comments