• Flask从入门到精通之Flask表单渲染成HTML


      表单字段是可调用的,在模板中调用后会渲染成HTML。假设视图函数把一个NameForm 实例通过参数form 传入模板,在模板中可以生成一个简单的表单,如下所示:

    <form method="POST">
        {{ form.hidden_tag() }}
        {{ form.name.label }} {{ form.name() }}
        {{ form.submit() }}
    </form>

      当然,这个表单还很简陋。要想改进表单的外观,可以把参数传入渲染字段的函数,传入的参数会被转换成字段的HTML 属性。例如,可以为字段指定id 或class 属性,然后定义CSS 样式

    <form method="POST">
        {{ form.hidden_tag() }}
        {{ form.name.label }} {{ form.name(id='my-text-field') }}
        {{ form.submit() }}
    </form>

      即便能指定HTML 属性,但按照这种方式渲染表单的工作量还是很大,所以在条件允许的情况下最好能使用Bootstrap 中的表单样式。Flask-Bootstrap 提供了一个非常高端的辅助函数,可以使用Bootstrap 中预先定义好的表单样式渲染整个Flask-WTF 表单,而这些操作只需一次调用即可完成。使用Flask-Bootstrap,上述表单可使用下面的方式渲染

    {% import "bootstrap/wtf.html" as wtf %}
    {{ wtf.quick_form(form) }}

      import 指令的使用方法和普通Python 代码一样,允许导入模板中的元素并用在多个模板中。导入的bootstrap/wtf.html 文件中定义了一个使用Bootstrap 渲染Falsk-WTF 表单对象的辅助函数。wtf.quick_form() 函数的参数为Flask-WTF 表单对象,使用Bootstrap 的默认
    样式渲染传入的表单。hello.py 的完整模板如一下示例:

    {% extends "base.html" %}
    {% import "bootstrap/wtf.html"as wtf %}
    {% block title %}Flask{% endblock %}
    
    {% block page_content %}
    <div>
        <h1>Hello, {% if name %}{{ name }}{% else %}Stranger{% endif %}!</h1>
    </div>
    {{ wtf.quick_form(form) }}
    {% endblock %}

      模板的内容区现在有两部分。第一部分是页面头部,显示欢迎消息。这里用到了一个模板条件语句。Jinja2 中的条件语句格式为{% if condition %}...{% else %}...{% endif %}。如果条件的计算结果为True,那么渲染if 和else 指令之间的值。如果条件的计算结果为False,则渲染else 和endif 指令之间的值。在这个例子中,如果没有定义模板变量name则会渲染字符串“Hello, Stranger!”。内容区的第二部分使用wtf.quick_form() 函数渲染NameForm 对象。

  • 相关阅读:
    springboot + mybatis-pagehelper 参数查询不分页的bug。。。
    不错位的java .class 反编译工具推荐
    git 生成ssh keys
    Spring boot 通用配置文件模板
    Shiro系列(3)
    Shiro系列(2)
    Shiro系列(1)
    updating
    前端速查手册——Note
    Java进阶知识与技术
  • 原文地址:https://www.cnblogs.com/senlinyang/p/8377312.html
Copyright © 2020-2023  润新知