javascript - 在 Wtform 中应用 JQuery 在 Flask 中动态执行添加输入字段
问题描述
这是我在谷歌找到的 html 和 jquery 代码。您可以动态添加输入文本标签。
<form method="post" action="submit.php">
<div class="form-group fieldGroup">
<div class="input-group">
<input type="text" name="name[]" class="form-control" placeholder="Enter name"/>
<input type="text" name="email[]" class="form-control" placeholder="Enter email"/>
<div class="input-group-addon">
<a href="javascript:void(0)" class="btn btn-success addMore"><span class="glyphicon glyphicon glyphicon-plus" aria-hidden="true"></span> Add</a>
</div>
</div>
</div>
<input type="submit" name="submit" class="btn btn-primary" value="SUBMIT"/>
</form>
查询:
<script type="text/javascript">
$(document).ready(function(){
//group add limit
var maxGroup = 10;
//add more fields group
$(".addMore").click(function(){
if($('body').find('.fieldGroup').length < maxGroup){
var fieldHTML = '<div class="form-group fieldGroup">'+$(".fieldGroupCopy").html()+'</div>';
$('body').find('.fieldGroup:last').after(fieldHTML);
}else{
alert('Maximum '+maxGroup+' groups are allowed.');
}
});
//remove fields group
$("body").on("click",".remove",function(){
$(this).parents(".fieldGroup").remove();
});
});
</script>
我想在 wtform 中创建它,但我无法以数组形式修改名称
class RegisterUser(FlaskForm):
regusertest = StringField('Username', validators=[
InputRequired(),
Length(min=5, max=30)
])
这是我的表单标签
<form id="login-form" action="webpage/gmsi/login" method="post" role="form" style="display: block;">
{{ form.hidden_tag() }}
{{ wtf.form_field(form.regusertest) }}
<input type="submit" class="btn btn-primary btn-lg" name="login-submit" id="login-submit" tabindex="4" class="form-control btn btn-login" value="Log In">
html标签的输出是
<input class="form-control" id="regusertest" name="regusertest" required="" type="text" value="">
我需要的是这个
<input class="form-control" id="regusertest" name="regusertest[]" required="" type="text" value="">
解决方案
推荐阅读
- php - Payone获取交易清单“历史”
- c++ - 执行显式模板实例化 (ETI) 的重复方式更少?(没有宏)
- python - 如何在python中重塑图像的尺寸
- bash - 在 conda 环境中,当我关闭终端时,GNU 并行作业停止启动新作业
- html - 使用 CSS 网格垂直扩展网格模板行时遇到问题
- css - 将主题变量的值传递给Angular中的子组件
- java - 如何覆盖父类中的方法并在子类中执行?
- android - 较低的 TextInputEditText 键入时不显示文本,仅在完成(或)下一个操作(或)点击屏幕中的任意位置时显示
- php - FilePond 向服务器发送一个空白请求
- typescript - 为什么我不能将类分配给具有较少属性的类型?