Question

我有以下代码，我正在使用bootstap模式（弹出对话框），当我点击＆＃34;添加＆＃34;按钮，将提交表单，就像显示的jquery代码一样。但是我不知道为什么在表单提交后，模态会自动隐藏，如何控制它以使其在表单提交后仍然存在？

    $("#personDialogAddPersonBtn").click(
            function(){
                $("#documentFile").attr("disabled", true);
                $("#announcementForm").attr("action","${contextPath}/announcement/addAnnoPubToPerson.action");
                $("#announcementForm").submit();
            }       
        );


<div id="addPersonDialog"class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="Add Person" aria-hidden="true">

 ...

 <div class="modal-footer">
  <a class="bt bt-pane b1" id="personDialogAddPersonBtn">Add</a>
  <a class="bt" id="personDialogCloseBtn">Close</a>
 </div>

Answer 1

您可能需要使用event.preventDefault()，并且您可能希望通过ajax提交表单：

$("#announcementForm").submit(function(e){
    e.preventDefault()
    $("#documentFile").attr("disabled", true);
    $.post( "${contextPath}/announcement/addAnnoPubToPerson.action", $(this).serialize() ).done(function(data) {
        //success
    })
    .fail(function() {
        //error
    });
});

Answer 2

使用.ajax（）以异步方式发送POST并避免刷新。

如果您的应用程序可以很好地使用JSON对象，您可以序列化表单，创建json对象并将其发送到您的应用程序。

$('#personDialogAddPersonBtn').click(function() {    

    data = $("#announcementForm").serializeObject();
    data = JSON.stringify(data);

    $.ajax({
        url: '${contextPath}/announcement/addAnnoPubToPerson.action'
        type: 'POST',
        data: data,
        contentType: 'application/json;charset=UTF-8',
        cache:false,
        success: function (response) {
            alert('Form submitted')
        },
        error: function(response){
            alert('Error submitting form)
        }
    });

});

$.fn.serializeObject = function()
    {
        var o = {};
        var a = this.serializeArray();
        $.each(a, function() {
            if (o[this.name] !== undefined) {
                if (!o[this.name].push) {
                    o[this.name] = [o[this.name]];
                }
                o[this.name].push(this.value || '');
            } else {
                o[this.name] = this.value || '';
            }
        });
        return o;
    };

为什么表单提交后引导模态隐藏？

2 个答案: