我有一个弹出式表单,使用以下形式调用:
$(function() {
$('#add-company').click(function() {
$('#contactForm').fadeToggle();
})
});
然后我使用以下命令通过Ajax提交表单:
jQuery(document).ready(function () {
$("#sbmt").click(function(e) {
e.preventDefault();
e.stopPropagation();
var one = document.getElementById("one").value;
var two = document.getElementById("two").value;
var DataForm = 'one1=' + one + '&two1=' + two;
if (one == '' || two == '') {
alert("Please Fill All Fields");
}
else {
// AJAX code to submit form.
jQuery.ajax({
type: "POST",
url: '/ajax.php',
data: DataForm,
dataType:"json",
success:function() {
$('#company-form').each(function(){
this.reset(); //Here form fields will be cleared.
});
},
complete: function(){
$('#contactForm3').fadeToggle();
}
});
return false;
}
});
});
我希望在数据更新后关闭表单,如您所见,我已经添加:
complete: function(){
$('#contactForm3').fadeToggle();
}
但没有喜悦。
对于大多数字段来说,哪种方法都可以正常工作,但是有几个下拉<select>
字段无法清除,因此如果我再次打开表单,这些字段将保持填充状态。
如果需要表单代码
<div id="contactForm3">
<h1>Form</h1>
<form action="" method="POST" name="company-form" id="company-form">
<span>
<label>One</label>
<input id="one" name="one" placeholder="one" type="text" required />
</span>
<span>
<select id="two" name="two" class="limitedNumbChosen" multiple="false">
<option value="Y">Yes</option>
<option value="N">No</option>
</select>
<input id="sbmit" class="formBtn" type="submit" />
<input class="formBtn" type="reset" />
</span>
</form>
</div>
更新
如果我使用
success: function() {
alert('Message sent');
},
complete: function(){
$('#dataForm3').each(function(){
this.reset(); //Here form fields will be cleared.
});
}
这清除了我认为只是一个开始的表格...
我尝试使用this.fadetoggle();
,但不是可接受的函数...我使用的是jQuery的最新版本,它可以打开表单但不能将其关闭?