我的问题实体有一个标准形式。
该表单中有一个模态表单,允许用户为其问题添加其他标签。
这是我的模态形式的图像:
这是我的模态表单的 Twig 模板:
<div id="mymodal" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">Add New Tag</h4>
</div>
<form class="tagForm" id="tag-form" action="{{ path('addTag') }}" method="post" enctype="multipart/form-data">
<div class="modal-body">
<label for="tagName">Tag Name: </label>
<input id="tagName" class="form-control" type="text"/>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<input id="tag-form-submit" type="submit" class="btn btn-primary" value="Add Tag">
</div>
</form>
</div>
</div>
用于查看我的模态表单的脚本:
$('#addTag').click(function(e) {
e.preventDefault();
$('#mymodal').modal();
});
我的模式表单提交脚本:
$(function() {
$('#tag-form').submit(function() {
$.ajax({
type: "POST",
url: "{{ path('addTag') }}",
data: $('form.tagForm').serialize(),
success: function(response) {
alert(response['response']);
},
error: function() {
alert('Error');
}
});
return false;
});
});
我的问题是,每次单击添加标签按钮时,包括问题表单在内的所有表单也会提交。
我真正想要的只是提交模式表单。
最佳答案
看起来你在提交事件上触发了这个,这就是为什么它......提交?也许这会更好?
$(function() {
$('#tag-form-submit').on('click', function(e) {
e.preventDefault();
$.ajax({
type: "POST",
url: "{{ path('addTag') }}",
data: $('form.tagForm').serialize(),
success: function(response) {
alert(response['response']);
},
error: function() {
alert('Error');
}
});
return false;
});
});
关于jquery - 通过 Ajax 提交模态表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22759087/