WTForms:如何添加“自动对焦"?属性分配给StringField [英] WTForms : How to add "autofocus" attribute to a StringField

问题描述

我对WTForms不太熟悉，Flask-WTF.我不知道如何从表单定义中简单地将HTML5属性自动对焦"添加到表单字段之一.我想在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')

我只想在字段"name1"中添加"autofocus"属性.

我在路线上尝试过:

@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中获得了很多答案，并尝试了各种解决方案，但是我陷入了困境.感谢您的帮助.

解决方案

我发现，您可以在表单类的字段中添加参数render_kw，在其中您可以添加用于渲染的所有关键字，包括自动对焦. /p>

所以我现在在表单类中是:

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中.

I am rather new to WTForms, Flask-WTF. I can't figure out how to simply add the HTML5 attribute "autofocus" to one of the form field, from the form definition. I would like to do that in the Python code, not in the Jinja template. Here is what I have :

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')

I just want to add the "autofocus" attribute to the field "name1".

I tried this in the route :

@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()
    .....

But this only changes the field value and do not add any attribute :

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

I read a lot of answers from SO and tried all kind of solutions, but I'm stuck. Thanks for your help.

解决方案

I have found, that you can add the argument render_kw to your field in your form class where you can add all the keywords for your rendering, including autofocus.

So what I have now in my form class is:

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')

This renders just as expected with wtf.quick_form() and places the cursor in the StringField on load with wtforms version 2.1 and flask-wtf version 0.14.2.

这篇关于WTForms:如何添加“自动对焦"?属性分配给StringField的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！