一、现象描述
如下从bootstrap示例登录页面参考的原生html代码,由于没有name属性导致表单数据没有提交:
<form class="form-signin" method="POST" action="/login/">
<!--<img class="mb-4" src="{{ url_for('static', filename = 'img/login.png') }}" alt="" width="100%" height="100%">-->
<h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
<label for="username" class="sr-only">Email address</label>
<input type="text" id="username" class="form-control" placeholder="用户名:" required>
<label for="password" class="sr-only">Password</label>
<input type="password" id="password" class="form-control" placeholder="密码:" autocomplete="off" required>
<div id="compare_result"><font color="red">{{ error }}</font></div>
<div class="checkbox mb-3">
<label>
<input type="checkbox" value="True" name="remember-me"> 记住我
</label>
</div>
<button class="btn btn-lg btn-primary btn-block" type="submit" id="sub">登录</button>
<p class="mt-5 mb-3 text-muted">© 2019-2020</p>
</form>
二、问题解决
在html input标签中加入name属性,表单数据就可以正常提交了。
<form class="form-signin" method="POST" action="/login/">
<!--<img class="mb-4" src="{{ url_for('static', filename = 'img/login.png') }}" alt="" width="100%" height="100%">-->
<h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
<label for="username" class="sr-only">Email address</label>
<input type="text" id="username" **name="username"** class="form-control" placeholder="用户名:" required>
<label for="password" class="sr-only">Password</label>
<input type="password" id="password" **name="password"** class="form-control" placeholder="密码:" autocomplete="off" required>
<div id="compare_result"><font color="red">{{ error }}</font></div>
<div class="checkbox mb-3">
<label>
<input type="checkbox" value="True" name="remember-me"> 记住我
</label>
</div>
<button class="btn btn-lg btn-primary btn-block" type="submit" id="sub">登录</button>
<p class="mt-5 mb-3 text-muted">© 2019-2020</p>
</form>