我认为我有几种不同的形式。在其中输入要搜索的名字和姓氏。如果有结果,页面将刷新,并在第二个表格中选择用户,该表格将显示为表格,在该表格上单击某行即可提交该行的数据。出于某种原因,提交第二个表单将导致为每个字段提交两个值:一个完全为空,一个具有正确的信息。
当单击表中的一行时,我将执行一些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()
从flask上获取数据。关于javascript - 当多个表单位于同一页面中时,WTForms两次提交表单,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/27736805/