無法阻止實際提交表單

我有像下面無法阻止實際提交表單

<form:form action="/campaign/delete" modelAttribute="campaignDeleteForm" enctype="multipart/form-data" class="form-inline"> 
     <input type="hidden" name="brandId" value="${brandId}" /> 
     <input type="hidden" name="campaignId" value="${campaign.campaignId}" /> 
     <button class="btn" data-dismiss="modal"><fmt:message key="daydiary.brand.delete.box.confirm.no" /></button> 
     <button class="btn btn-info btn-campaign-delete"><fmt:message key="daydiary.brand.delete.box.confirm.yes" /></button> 
    </form:form>

我的Java腳本看起來如下

$("#btn-campaign-delete").click(function(){ 
    var form = $(this).parents('form:first'); 
    doAjaxPost(form); 
    form.submit(); 
}); 

function doAjaxPost(form){ 
    form.on('submit' , function(e) { 
    e.preventDefault(); 
    $.ajax({ 
     type: "POST", 
     url: form.attr('action'), 
     data: form.serialize 
    }).done(function(data) { 

    }); 
    }); 
}

形式我看到的是Ajax請求去了服務器和現在網址更改爲/ campaign/delete。我想留在同一頁面上。這可能嗎？

來源

2014-02-24 Saurabh Kumar

' AD7six

<％@ taglib prefix =「form」uri =「http://www.springframework.org/tags/form」％> –

如果你想停止將表單從表單提交到您定義的操作URL。請嘗試以下操作：

在您的窗體標記中只需添加此屬性onSubmit ='返回false;'

< form onSubmit='return false;' action="" modelAttribute="campaignDeleteForm" enctype="multipart/form-data" class="form-inline">

從你的jQuery代碼您發佈的數據刪除提交功能，保持AJAX，因爲它是。

function doAjaxPost(form){ 
    $.ajax({ 
     type: "POST", 
     url: form.attr('action'), 
     data: form.serialize 
    }).done(function(data) { 

    }); 
}

我希望這可以工作。

來源

2014-02-24 13:07:08

@Saurabh Kumar在ajax URL參數中，您可以將請求傳遞給文件。您可以在URL參數中設置文件的路徑。 –

如果你想留在頁面上，請不要提交。換言之，刪除不必要的行：

form.submit();

來源

2014-02-24 10:26:59 pid

這thread顯示了問題。手動調用提交時，不會觸發onSubmit。

來源

2014-02-24 10:27:07 Marii

如果你想發送Ajax請求到同一個頁面，你可以讓你的URL參數裏面你AJAX請求爲空字符串，並留下您的表單操作空以及：

<form:form action="" modelAttribute="campaignDeleteForm" enctype="multipart/form-data" class="form-inline">

來源

2014-02-24 10:27:16 Felix

但是，如果兩個網址都是空的...請求去哪...我錯過了什麼... –

@SaurabhKumar請在我的回覆中看到評論。 –

無法阻止實際提交表單

回答

相關問題