注意:

1.在视图函数中通过request.args.get('page')获取page数,并将page传给macros.html模板文件

效果:

点击8,就跳转到第8页数据了

视图函数

@app.route('/auto_test_case', methods=['GET', 'POST'])
def auto_test_case(): form = SearchForm()
page = request.args.get('page', 1, type=int)
per_page = current_app.config['GOGOTEST_CASE_PRE_PAGE']
# 获取全部脚本测试用例
pagination = TestCase.query.paginate(page, per_page=per_page)
auto_test_case_objs=pagination.items
return render_template('auto_test_case.html', pagination=pagination,cases=auto_test_case_objs, form=form,page=page)

macros.html定义宏:

<!--分页导航-->
{% macro my_render_pagination(pagination, endpoint) %}
<ul class="pagination">
<!-- {# 上一页 #}-->
{% if pagination.prev_num %}
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
{% else %}
<li class="disabled">
<a href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
{% endif %} {% for page in pagination.iter_pages() %}
{% if page %}
{% if page != pagination.page %}
<li>
<a href="{{ url_for(request.endpoint, page=page) }}">{{ page }}</a>
</li>
{% else %}
<li class="active">
<a><strong>{{ page }}</strong></a>
</li>
{% endif %}
{% else %}
<li>
<span class=ellipsis>…</span>
</li>
{% endif %}
{% endfor %}
<!-- {# 下一页 #}-->
{% if pagination.next_num %}
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
{% else %}
<li class="disabled">
<a href="#" aria-label="Previous">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
{% endif %}
</ul>
{% endmacro %}

case_manage.html

导入宏

{%from "macros.html" import my_render_pagination%}

调用宏

<div class="page-footer">{{ my_render_pagination(pagination) }}

参考文档:

flask-bootstrap和分页

[Flask]jinja2渲染分页导航部件的更多相关文章

  1. 网站功能操作分布引导插件:Intro.js介绍;React里如何使用Intro.js以及如何进行分页导航

    插件作用:使用向导,引导新用户正确使用Web网站.我的环境是React+Mobx. 基本使用介绍,参加代码地址里的README.md:https://github.com/usablica/intro ...

  2. Flask模板渲染

    目录 Flask模板渲染 Jinja2模板引擎简介 模板 Jinja2 模板变量 变量 控制结构 宏,类似Python代码中的函数 模板继承 包含(Include) 过滤器 链式调用 常见内建过滤器 ...

  3. 初探 Python Flask+Jinja2 SSTI

    初探 Python Flask+Jinja2 SSTI 文章首发安全客:https://www.anquanke.com/post/id/226900 SSTI简介 SSTI主要是因为某些语言的框架中 ...

  4. Bootstrap系列 -- 44. 分页导航

    带页码的分页导航,可能是最常见的一种分页导航,特别是在列表页内容超多的时候,会给用户提供分页的导航方式.平时很多同学喜欢用div>a和div>span结构来制作带页码的分页导航.不过,在B ...

  5. 用flask实现的分页

    一.flask实现的分页组件 from urllib.parse import urlencode,quote,unquote class Pagination(object): "&quo ...

  6. wordpress文章页两侧添加分页导航箭头

    分页导航 如果添加在文章页的两侧,很方便读者翻阅,小编发现好多站长的博客都添加了这一功能,百度了一下,就是JS和css的功能,经过测试成功,分享一下流程. 1.添加Js 在headr.php或者foo ...

  7. Bootstrap学习-导航条-分页导航

    1.导航条基础 导航条(navbar)和上一节介绍的导航(nav),就相差一个字,多了一个“条”字.其实在Bootstrap框架中他们还是明显的区别.在导航条(navbar)中有一个背景色.而且导航条 ...

  8. bootstrap基础学习【导航条、分页导航】(五)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. jinja2渲染使用

    说明:通过jinja2渲染后只能打印出来效果,目前无法保存 例1:渲染 .j2 文件 1.安装jinja2模块 pip3 install jinja2 2.定义模板 说明:变量必须是小写,大写有的情况 ...

随机推荐

  1. HackIM web关writeup

    Web100 访问页面将看到下面的错误 在burp里使用request / response查看有没有什么不正常的地方.如下图所示,在返回的数据包里被设置了两次不同的PHPSESSID. 如果我把PH ...

  2. 生成大量插入语句,并将语句写入txt文件中

    import java.io.*; /** * Created by czz on 2019/9/23. */ public class TTest { /** * 生成大量插入语句,并将语句写入tx ...

  3. openstack Rocky系列之keystone:(一)keystone的启动

    keystone在httpd的入口执行文件为/usr/bin/keystone-wsgi-public 查看文件/usr/bin/keystone-wsgi-public,根据代码,看到主要是这几行代 ...

  4. (转) SpringBoot:使用spring-boot-devtools进行热部署以及不生效的问题解决

    在idea上怎么才能使用Spring的热部署 这里仅用Maven做介绍 (1)在Maven中添加依赖 (2)在插件配置 但是,为什么配置了还是没有用呢 ?! 这是因为idea默认是没有自动编译的,我们 ...

  5. mysql 存储过程(二)

    存储过程(Stored Procedure): 一组可编程的函数,是为了完成特定功能的SQL语句集,经编译创建并保存在数据库中,用户可通过指定存储过程的名字并给定参数(需要时)来调用执行. 优点(为什 ...

  6. monkey命令大全

    一.认识monkey Monkey 就是SDK中附带的一个工具.Monkey是Android中的一个命令行工具,可以运行在模拟器里或实际设备中: 它向系统发送伪随机的用户事件流(如按键输入.触摸屏输入 ...

  7. Centos 7搭建Gitlab服务器以及操作(创建项目,创建群组,创建用户,添加密钥)

    一. 安装并配置依赖包 在CentOS系统上安装所需的依赖:ssh,防火墙,postfix(用于邮件通知) ,wget,以下这些命令也会打开 系统防火墙中的HTTP和SSH端口访问 安装前准备 命令: ...

  8. Linux基本命令之Vim

    在vim,vi,gedit编辑器中显示行号:        在命令模式下:set nu 取消行号:set nonu 参照博客:https://www.cnblogs.com/Mr0wang/p/728 ...

  9. 使用maven简单搭建Spring mvc + redis缓存

    注:此文参考并整合了网上的文章 <spring缓存机制>:http://blog.csdn.net/sidongxue2/article/details/30516141 <配置 S ...

  10. Java 5,6,7,8,9,10,11新特性

    转自https://it18monkey.github.io java5 泛型 (Generics) List<Integer> list=new ArrayList<Integer ...