自定义 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'添加 HTML类属性，但是 Flask-WTF 和 WTForms 文档似乎没有涉及任何其他属性（例如autcomplete="off"或placholder="username"）

有没有什么方法可以用我所缺少的 Flask-WTF 或 WTForms 来完成这个任务？对于此类功能，我是否仅限于手动属性和/或 Jinja 宏？我无法想象 WTForms 和 Flask-WTF 会缺少这一点，但我也没有看到文档或 Google/StackOverflow 上的任何地方提到它。

谢谢！

Answer 1

在发生此WTForms : How to add "autofocus" attribute to a StringField后，我尝试使用相同的方法来解决我的问题。它奏效了。仍然不确定为什么 WTForms 或 Flask-WTForms 文档中没有涵盖这一点。

因此，对于标签，要让它们包含类或您需要的其他属性，请在模板中添加与上面的class_=解释相同的内容。

所以在这种情况下：

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

渲染时将适当的类添加到标签。

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

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

使用适合类、占位符、自动完成、自动对焦和字段大小的 HTML 进行渲染。

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