提交时关闭表单弹出窗口

时间:2019-10-01 08:50:21

标签: jquery html

我有一个弹出式表单,使用以下形式调用:

$(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的最新版本,它可以打开表单但不能将其关闭?

0 个答案:

没有答案