Question

我对WTForms，Flask-WTF很新。我无法弄清楚如何简单地从表单定义中将HTML5属性“autofocus”添加到表单字段之一。我想在Python代码中这样做，而不是在Jinja模板中。这就是我所拥有的：

class NameForm(Form):
    name1 = StringField("Nom d'utilisateur :",
                    validators=[Required(), Length(1, 16)])
    pwd1 = PasswordField("Mot de passe :",
                     validators=[Required(), Length(1, 16)])
    mail1 = StringField("Compte GMail du calendrier :",
                    validators=[Required(), Email()])
    submit = SubmitField('Envoyer')

我只想将“autofocus”属性添加到字段“name1”。

我在路线上尝试了这个：

@app.route('/', methods=['GET', 'POST'])
def form():
    name1 = None
    pwd1 = None
    mail1 = None
    msg = None
    # Tests
    Name_Form_kwargs = {"name1": "" ,"autofocus" :"true"}
    Name_Form = NameForm(**Name_Form_kwargs)
    print Name_Form.name1
    # 
    form = NameForm()
    .....

但这只会更改字段值，不会添加任何属性：

<input id="name1" name="name1" type="text" value="">

我从SO那里读了很多答案并尝试了各种解决方案，但我被困住了。谢谢你的帮助。

Answer 1

我发现，您可以将参数render_kw添加到表单类的字段中，您可以在其中添加渲染的所有关键字，包括自动对焦。

所以我现在在表单类中的内容是：

class CheckForm(FlaskForm):
    """
    Check-in or check-out users.
    """
    checkmode = RadioField('checkmode', validators=[DataRequired()], choices=[('in', 'Check-In'), ('out', 'Check-Out')])
    datainput = StringField('Name', validators=[DataRequired()], render_kw={'autofocus': True})
    submit = SubmitField('Submit')

这与wtf.quick_form（）一样呈现，并在加载时使用wtforms版本2.1和flask-wtf版本0.14.2将光标放在StringField中。

Answer 2

必须由file.html Jinja模板完成。所以声明如下：

{{ form.input1(autofocus=true) }}

这会将单个autofocus属性放入您的html代码中。

Answer 3

只有你使用：

autofocus=true

你的file.html中的

Answer 4

你无法通过表单的Python定义来实现，而不是我能找到的。这样做的方法是添加一些Javascript以关注页面加载时所需的字段。

我有一个使用Flask-Bootstrap的项目（因此jQuery已经加载了）这意味着你的模板需要包含一个

grades[score]

在表单模板中，将以下内容放在最后：

{% block scripts %}{% endblock %}

WTForms：如何将“autofocus”属性添加到StringField

4 个答案: