在不使用 flask-bootstrap 的情况下使用 wtfroms

Question

我开始为项目创建登录注册网页，为此我想使用“wtforms”，但如果不使用 flask-bootstrap 库，我找不到任何示例。 我可以在没有flask-bootstrap的情况下使用wtform吗？

我做了一些实验，但似乎没有用。

这是我的代码： HTML：

<div class="login-form">
        <form action="/registration" method="POST">
            <h2 class="text-center">Registrazione</h2>
            <div class="form-group has-error">
                <input type="text" class="form-control" name="nome" placeholder="Nome" required="required">
            </div>
            <div class="form-group has-error">
                <input type="text" class="form-control" name="cognome" placeholder="Cognome" required="required">
            </div>
            <div class="form-group">
                <input type="email" class="form-control" name="email" placeholder="E-mail" required="required">
            </div>
            <div class="form-group">
                <input type="password" class="form-control" name="password" placeholder="Password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="la password deve contenere almeno un numero, una lettera maiuscola, una minuscola e deve essere almeno di 8 carateri" required="required">
            </div>
            <div class="form-group">
                <input type="password" class="form-control" name="confermaPsw" placeholder="Conferma password"  pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="la password deve contenere almeno un numero, una lettera maiuscola, una minuscola e deve essere almeno di 8 carateri" required="required">
            </div>
            <div class="form-group">
                <select class="form-control" name="ruolo" id="sel1" required="required">
                   <option>SW</option>
                   <option>PM</option>
                   <option>PE</option>
                </select>
            </div>
            <div class="form-group">
                <button type="submit" class="btn btn-primary btn-lg btn-block">Registrati</button>
            </div>
        </form>

Python：

class RegisterForm(FlaskForm):
    name = StringField('name', validators=[InputRequired(), Length(min=4, max=15)])
    surname = StringField('surname', validators=[InputRequired(), Length(min=4, max=15)])
    email = StringField('email', validators=[InputRequired(), Length(max=50)])
    password = PasswordField('password', validators=[InputRequired(), Length(min=8, max=80)])
    ruolo = StringField('urole', validators=[InputRequired()])

@app.route('/registration', methods=['POST', 'GET'])
def registration():
    # se tutti gli input rispettano i prerequisiti di validazione, aggiungi utente
    form = RegisterForm()
    if request.method == 'POST':
        if form.validate_on_submit():
            hashed_password = generate_password_hash(form.password.data, method='sha256')
            new_user = User(name=form.nome.data, surname=form.cognome.data, email=form.email.data, password=hashed_password, urole=form.ruolo.data)
            db.session.add(new_user)
            db.session.commit()

            return '<h1>New user has been created!</h1>'
        return '<h1>post send but no validate!</h1>'

    return render_template("registration.html", form=form)


EDIT: I need to have the same formatting I had before using WTForms
 

Answer 1

我也在寻找这个确切问题的解决方案，但都使用flask-bootstrap，而这正是我不想使用的。

我尝试了以下方法：

{{ form.firstname(class='form-control bg-white border-left-0 border-md', placeholder='Firstname') }}

输出

<input class="form-control bg-white border-left-0 border-md" id="firstname" name="firstname" placeholder="Firstname" required type="text" value="">

这似乎有效，从视觉上看，它似乎在做我想要的。