当多个表单在同一页面中时,WTForms提交表单两次
WTForms submitting form twice when multiple forms are in the same page
在我看来,我有几种不同的形式。 在一个中,您输入要搜索的名字和姓氏。 如果有结果,页面将刷新,用于选择用户的第二个窗体将显示为一个表格,单击一行将提交该行中的数据。 出于某种原因,提交第二个表单会导致为每个字段提交两个值:一个完全为空,另一个包含正确的信息。
我有一些JavaScript,当单击表中的行时将执行。 它应该填写并提交一个隐藏的表单,其中包含表中的数据。 我遇到的问题是,提交表单时,会提交两组值。 提交表单后的 request.form 包含以下内容:
ImmutableMultiDict([('csrf_token', u'1420171907##6ad5346730985191250a52e6432e924ef05c23ee'), ('last_name', u''), ('last_name', u'Smith'), ('first_name', u''), ('first_name', u'John')])
下面是脚本:
$('table#theTable tr').click(function () {
var cells = this.getElementsByTagName('td');
$('#selectuser_last_name').val(cells[0].innerHTML);
$('#selectuser_first_name').val(cells[1].innerHTML);
document.selectuser.submit();
});
这是与之配套的 HTML:
<table id="theTable">
<thead>
<tr>
<th>Last</th>
<th>First</th>
</tr>
</thead>
<tbody>
{% for user in users %}
<tr>
<td>{{ user.last_name }}</td>
<td>{{ user.first_name }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<form id=selectUserForm action="/handle_users" method="post" name="selectuser">
{{ forms.selectuser.hidden_tag() }}
{{ forms.selectuser.last_name(id="selectuser_last_name") }}
{{ forms.selectuser.first_name(id="selectuser_first_name") }}
<input type="submit">Test</input>
</form>
我正在使用Python和Flask来处理发布的任何内容。
看起来你实际上提交了两次 - 一次是在表单中有任何内容之前,一次是在填充之后(后者通过javascript,前者通过表单提交机制)。
如果用户并没有真正在表单中输入任何内容,但这是每次单击行时对服务器的简单调用。跳过整个表单,这里没有帮助。只需将带有所需信息的调用传递给服务器 - 可以是一个简单的 ajax 帖子:
$('table#theTable tr').click(function () {
var cells = this.getElementsByTagName('td');
$.ajax({
type : "POST",
url : "/handle_users",
async:true,
contentType : 'application/json;charset=UTF-8',
data: JSON.stringify({first_name:cells[0].innerHTML,last_name:cells[1].innerHTML}, null, ''t'),
success : function(data) {
// optional: do something when server-side processing is done
}
});
});
然后使用/handle_users 路由中的request.get_json()
从烧瓶中获取数据。
相关文章:
- HTML表单提交时未执行外部函数
- JS表单提交"无法使用Chrome数据保护程序加载此页面.尝试重新加载页面.调试信息:POST CISmtuK
- 将图像上传ajax与表单提交ajax相结合
- Javascript无法处理表单提交
- 如何在我的情况下禁用表单提交
- 加载后的页面与ajax表单提交不起作用
- angularjs-控制器在表单提交时未调用
- 禁用带有字符白名单的表单提交
- 如何使用Google Analytics跟踪表单提交
- 使用javascript将表单提交到iframe目标中
- e.preventDefault在表单提交时被忽略
- AngularJS JQuery Ajax表单提交等效
- JavaScript表单提交帮助
- PHP表单提交和重定向
- 当所有输入文本字段都为空时,禁止表单提交,但当jquery中的任何字段不为空时允许提交
- setTimeOut AFTER jQuery表单提交
- 从函数中选择要触发表单提交的正确元素
- JavaScript表单提交没有't fire asp服务器端点击功能的提交按钮
- 表单提交问题,如何在我的URL末尾获得ID的值
- Javascript使用Confirm取消表单提交