自定义 Flask-WTF 或 WTForms

Question

我正在尝试将 Flask 集成为我正在使用的 UI 的后端。

不幸的是，UI 已经为表单设置了 CSS 和 JavaScript（以适应 UI 但也适用于旧版本的 IE 和其他个案）。

我运行遇到的第一个问题是字段已经有了标签。如果我在模板中使用 .labels 属性：

{{ form.username.label }}

然后它创建了一个额外的标签，我似乎无法为 CSS/JavaScript 添加任何属性。但是，如果我关闭 .label 属性，则会在用户名输入上方创建一个额外的空白文本字段。

我的 forms.py 文件中的代码是：

class LoginForm(FlaskForm):
    username = StringField('Username', validators=[DataRequired()])

我是不是漏掉了什么？

第二部分是向表单本身添加属性。我找到了如何使用 class_='classname'[=37 添加 HTML class 属性=]，但 Flask-WTF 和 WTForms 文档似乎没有涉及任何其他属性（例如 autcomplete="off" 或 placholder="username")

有没有什么方法可以使用我刚刚缺少的 Flask-WTF 或 WTForms 来完成此操作？对于此类功能，我是否仅限于手动属性 and/or Jinja 宏？我无法想象这是 WTForms 和 Flask-WTF 中缺少的东西，但我也没有在文档或 Google/Whosebug.
的任何地方看到它被提及
谢谢！

Answer 1

发生这种情况后我尝试使用相同的方法来解决我的问题。它奏效了。仍然不确定为什么 WTForms 或 Flask-WTForms 文档中没有涵盖这一点。

所以对于标签，让它们包含class，或者你需要的其他属性，在模板中添加它与class_=上面的解释。

所以在这种情况下：

{{ form.username.label(class_="ie9") }}

在呈现时向标签添加适当的 class。

对于字符串输入，属性再次添加到模板中：

{{ form.username(class_="formplace", placeholder="Username", autocomplete="off", autofocus="true", size=32) }}

为 class、占位符、自动完成、自动对焦和字段大小使用适当的 HTML 呈现。

我确信这可以动态化并可重用，但我只是想展示解决方案，因为我不是唯一遇到此问题的人。具体来说，是 0xTim 的解决方案让我找到了可用的东西。

Answer 2

除了@Andy Lance 上面所说的，您还可以在烧瓶形式中使用render_kw。假设你有一个 forms.py:

class CommentForm(FlaskForm):
    comment = TextAreaField('Comment', validators=[DataRequired()]) #<---------Add placeholder info
    submit = SubmitField('Post')

修改 TextAreaField 以包含 render_kw:

class CommentForm(FlaskForm):
    comment = TextAreaField('Comment', validators=[DataRequired()], render_kw={"placeholder": "Markdown Enabled"}) #<---------placeholder info added
    submit = SubmitField('Post')

您无需修改模板即可显示关键字。将模板维护为（如果使用 flask-bootstrap）：

{{ wtf.quick_form(form) }}

自定义 Flask-WTF 或 WTForms

Customizing Flask-WTF or WTForms

python

flask

wtforms

flask-wtforms