2019-12-12 symfony 分页异步加载

可以参考一下

js文件:

// 搜索
$('#search').on('click', function () {
  let title = 'title=' + $('#title').val();
  let param = title + '&' + $('#urlParameter').val();
  let url = $(this).attr('data-url') + '?' + param;
  getExamList(url);
});

// 分页
$('div[data-role="market"]').on('click', 'li', function () {
  let url = $(this).data('url');
  let title = 'title=' + $('#title').val();
  if (url.split('?').length === 1) {
    url = url + title + '&' + $('#urlParameter').val();
  } else {
    url = url + '&' + title + '&' + $('#urlParameter').val();
  }
  getExamList(url);
});

function getExamList(url) {
  let context = $('div[data-role="market"]');

  $.get(url, function (data) {
    context.html(data);
  }).fail(function () {
    let loading = '<div class="empty" colspan="10" style="color:#999;padding:80px;">' + Translator.trans('加载出错...') + '</div>';
    context.html(loading);
  });
}

yml文件(routing):

role_play_exam_list:
      path:  /role_play_exam_list
      defaults: { _controller: CorporateTrainingBundle:Activity/RolePlay:searchRolePlayList }

php文件(controller):

public function searchCourseSet(Request $request){
        $conditions = $request->request->all();
        $selectedConditions = array('title', 'page', 'pageSize', 'category', 'subCategory', 'selectedthirdLevelCategory');
        $conditions = ArrayToolkit::parts($conditions, $selectedConditions);// 过滤数据

        $total = $this->getRolePlayService()->searchRolePlays($conditions);
        $paginator = new Paginator($request, $total, 20 );
        // 设置分页跳转的页面, 若有需要
        // $paginator->setBaseUrl($this->generateUrl('role_play_exam_list'));

        $exams = $this->getRolePlayService()->searchRolePlays(
            $conditions,
            array(),//  array('id' => 'DESC'),
            $paginator->getOffsetCount(),
            $paginator->getPerPageCount()
        );

        return $this->render(
            'activity/role-play/table.html.twig',
            array(
                'exams' => $exams,
                'paginator' => $paginator,
            )
        );
    }

twig文件:

{#  导入ajax分页器 #}
{% import "macro.html.twig" as web_macro %}   

……

{#  twig 调用 #}
      <button id="search" data-url="{{ path('role_play_exam_list') }}" type="submit">搜索</button>

<div data-role="market">
      {#  tiwg 显示 #}
      {{ render(controller('CorporateTrainingBundle:Activity/RolePlay:searchRolePlayList')) }}
</div>

……

{# ajax分页器使用 #}
{{ web_macro.ajax_paginator(paginator) }}

macro.html.twig中的ajax_paginator部分

{% macro ajax_paginator(paginator, class)  %}
  <input class="js-page" type="hidden" name="page" value="{{ paginator.currentPage|default(1) }}">

  {% if paginator.lastPage > 1 %}
    <nav class="{{ class|default('text-center') }}">
      <ul class="pagination cd-pagination">
        {% if paginator.currentPage != paginator.firstPage %}
          <li data-url="{{ paginator.getPageUrl(paginator.firstPage) }}" data-page="{{paginator.firstPage}}"><a href="javascript:;"><i class="cd-icon cd-icon-first-page"></i></a></li>
          <li data-url="{{ paginator.getPageUrl(paginator.previousPage) }}" data-page="{{paginator.previousPage}}"><a  href="javascript:;"><i class="cd-icon cd-icon-arrow-left"></i></a></li>
        {% endif %}
        {% for page in paginator.pages %}
          <li {% if page == paginator.currentPage %}class="active"{% endif %} data-url="{{ paginator.getPageUrl(page) }}" data-page="{{page}}"><a href="javascript:;">{{ page }}</a></li>
        {% endfor %}

        {% if paginator.currentPage != paginator.lastPage %}
          <li data-url="{{ paginator.getPageUrl(paginator.nextPage) }}" data-page="{{paginator.nextPage}}"><a  href="javascript:;"><i class="cd-icon cd-icon-arrow-right"></i></a></li>
          <li data-url="{{ paginator.getPageUrl(paginator.getLastPage) }}" data-page="{{paginator.getLastPage}}"><a  href="javascript:;"><i class="cd-icon cd-icon-last-page"></i></a></li>
        {% endif %}
      </ul>
    </nav>
  {% endif %}
{% endmacro %}

Paginator类

<?php

namespace AppBundle\Common;

class Paginator
{
    protected $itemCount;

    protected $perPageCount;

    protected $currentPage;

    protected $pageRange = 10;

    protected $baseUrl;

    protected $pageKey = 'page';

    public function __construct($request, $total, $perPage = 20)
    {
        $this->setItemCount($total);
        $this->setPerPageCount($perPage);

        $page = (int) $request->query->get('page');

        $maxPage = ceil($total / $perPage) ?: 1;
        $this->setCurrentPage($page <= 0 ? 1 : ($page > $maxPage ? $maxPage : $page));

        $this->setBaseUrl($request->server->get('REQUEST_URI'));
    }

    public function setItemCount($count)
    {
        $this->itemCount = $count;

        return $this;
    }

    public function setPerPageCount($count)
    {
        $this->perPageCount = $count;

        return $this;
    }

    public function getPerPageCount()
    {
        return $this->perPageCount;
    }

    public function setCurrentPage($page)
    {
        $this->currentPage = $page;

        return $this;
    }

    public function setPageRange($range)
    {
        $this->pageRange = $range;

        return $this;
    }

    public function setBaseUrl($url)
    {
        $template = '';

        $urls = parse_url($url);
        $template .= empty($urls['scheme']) ? '' : $urls['scheme'].'://';
        $template .= empty($urls['host']) ? '' : $urls['host'];
        $template .= empty($urls['path']) ? '' : $urls['path'];

        if (isset($urls['query'])) {
            parse_str($urls['query'], $queries);
            $queries['page'] = '..page..';
        } else {
            $queries = array('page' => '..page..');
        }
        $template .= '?'.http_build_query($queries);

        $this->baseUrl = $template;
    }

    public function getPageUrl($page)
    {
        return str_replace('..page..', $page, $this->baseUrl);
    }

    public function getPageRange()
    {
        return $this->pageRange;
    }

    public function getCurrentPage()
    {
        return $this->currentPage;
    }

    public function getFirstPage()
    {
        return 1;
    }

    public function getLastPage()
    {
        return ceil($this->itemCount / $this->perPageCount);
    }

    public function getPreviousPage()
    {
        $diff = $this->getCurrentPage() - $this->getFirstPage();

        return $diff > 0 ? $this->getCurrentPage() - 1 : $this->getFirstPage();
    }

    public function getNextPage()
    {
        $diff = $this->getLastPage() - $this->getCurrentPage();

        return $diff > 0 ? $this->getCurrentPage() + 1 : $this->getLastPage();
    }

    public function getOffsetCount()
    {
        return ($this->getCurrentPage() - 1) * $this->perPageCount;
    }

    public function getItemCount()
    {
        return $this->itemCount;
    }

    public function getPages()
    {
        $previousRange = round($this->getPageRange() / 2);
        $nextRange = $this->getPageRange() - $previousRange - 1;

        $start = $this->getCurrentPage() - $previousRange;
        $start = $start <= 0 ? 1 : $start;

        $pages = range($start, $this->getCurrentPage());

        $end = $this->getCurrentPage() + $nextRange;
        $end = $end > $this->getLastPage() ? $this->getLastPage() : $end;

        if ($this->getCurrentPage() + 1 <= $end) {
            $pages = array_merge($pages, range($this->getCurrentPage() + 1, $end));
        }

        return $pages;
    }

    public static function toArray(Paginator $paginator)
    {
        return array(
            'firstPage' => $paginator->getFirstPage(),
            'currentPage' => $paginator->getCurrentPage(),
            'firstPageUrl' => $paginator->getPageUrl($paginator->getFirstPage()),
            'previousPageUrl' => $paginator->getPageUrl($paginator->getPreviousPage()),
            'pages' => $paginator->getPages(),
            'pageUrls' => array_map(function ($page) use ($paginator) { return $paginator->getPageUrl($page); }, $paginator->getPages()),
            'lastPageUrl' => $paginator->getPageUrl($paginator->getLastPage()),
            'lastPage' => $paginator->getLastPage(),
            'nextPageUrl' => $paginator->getPageUrl($paginator->getNextPage()),
        );
    }
}