You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flask WTForms提交按钮无响应,注册页面功能异常求助

Flask注册页面WTForms提交按钮失效问题求助

跟随YouTube上JimShapedCoding的Flask教程制作注册页面,使用WTForms时遇到提交按钮完全失效的问题。填写所有字段后点击“Create Account”按钮无任何反应,数据库未生成用户实例,也未跳转到目标URL。

已尝试的调试操作

  • 在routes.py的db.session.add(user_to_create)前添加app.app_context().push()
  • 核对所有变量名确保一致
  • 使用$env:FLASK_APP='__init__.py'搭配flask run启动项目

终端日志

127.0.0.1 - - [10/Apr/2023 23:09:02] "GET /register HTTP/1.1" 200 -
127.0.0.1 - - [10/Apr/2023 23:09:11] "GET /favicon.ico HTTP/1.1" 404 -

项目代码

init.py

from flask import Flask, render_template 
from flask_sqlalchemy import SQLAlchemy    #tables using classes

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///market.db'
app.config['SECRET_KEY'] = 'b61198e1258118d75478e8e4'
db = SQLAlchemy(app)


from market import routes

forms.py

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField


class RegisterForm(FlaskForm):
    username = StringField(label='Enter your username:')
    email_address = StringField(label='Email:')
    pw1 = PasswordField(label='Password:')
    pw2 = PasswordField(label='Confirm Password:')
    submit = SubmitField(label='Create Account')

models.py

from market import db

class User(db.Model):
    id = db.Column(db.Integer(), primary_key=True)
    username = db.Column(db.String(length=18), nullable=False, unique=True)
    email_address = db.Column(db.String(length=40), nullable=False, unique=True)
    password_hash = db.Column(db.String(length=60), nullable=False)
    budget = db.Column(db.Integer(), nullable=False, default=1000)
    items = db.relationship('Item', backref='owned_user', lazy=True)

    def __repr__(self):
        return f"Item: {self.name}"

routes.py

from market import app
from flask import Flask, render_template, redirect, url_for
from market.models import Item, User
from market.forms import RegisterForm
from market import db

@app.route('/register', methods=['GET', 'POST'])
def register_page():
    form = RegisterForm()
    if form.validate_on_submit():
        user_to_create = User(username=form.username.data,
                              email_address=form.email_address.data,
                              password_hash=form.pw1.data)    
        db.session.add(user_to_create)
        db.session.commit()
        return redirect(url_for('market_page'))

    return render_template('register.html', form=form)

run.py

from market import app

if __name__ == '__main__':
    app.run(debug=True)

templates/register.html

{% extends 'base.html' %}
{% block title %}
    Register 
{% endblock %}   
{% block content %}
<body  class='text-center'>
    <div class="container"
        <form method="POST" action="/market" class="form-register" style="color:white">
            {{ form.hidden_tag() }}
            <img class="mb-4" src="" alt="">
            <h1 class="h3 mb-3 font-weight-normal">
                Please Create your Account
            </h1>
            <br>
            
            {{ form.username.label() }}
            {{ form.username(class="form-control", placeholder="Username") }}
            
            {{ form.email_address.label() }}
            {{ form.email_address(class="form-control", placeholder="Email Address") }}
            
            {{ form.pw1.label() }}
            {{ form.pw1(class="form-control", placeholder="Password") }}
            
            {{ form.pw2.label() }}
            {{ form.pw2(class="form-control", placeholder="Confirm Password") }}
            
            <br>
            
            {{ form.submit(class="btn btn-lg btn-block btn-primary") }} 
        </form>
    </div>
</body>  
{% endblock %}  

templates/base.html

<!doctype html>
<html lang="en">
   <head>
      <!-- Required meta tags -->
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <title>
        {% block title %}

        {% endblock%}
      </title>
   </head>
   <body>
      <nav class="navbar navbar-expand-md navbar-dark bg-dark">
        <a class="navbar-brand" href="#">Flask Market</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNav">
          <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                  <a class="nav-link" href="{{ url_for('home_page') }}">Home <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                  <a class="nav-link" href="{{ url_for('market_page') }}">Market</a>
              </li>
          </ul>
          <ul class="navbar-nav">
              <li class="nav-item">
                  <a class="nav-link" href="#">Login</a>
              </li>
              <li class="nav-item">
                  <a class="nav-link" href="{{ url_for('register_page') }}">Register</a>
              </li>
          </ul>
        </div>
      </nav>
        {% block content %}

        {% endblock %}
   </body>
   <style>
      body {
      background-color: #212121;
      color: white
      }
   </style>
</html>

项目相关截图说明

  • 项目布局:标准Flask项目结构,包含market包(内有__init__.py、forms.py、models.py、routes.py)、templates文件夹(内有base.html、register.html)、run.py文件
  • 注册页面展示:表单包含用户名、邮箱、密码、确认密码输入框及“Create Account”提交按钮,深色背景搭配白色文字

已反复核对代码与教程一致,但问题持续存在,恳请提供帮助。

内容的提问来源于stack exchange,提问作者Whqat

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.25 03:37:00