easyUI的form表單重複提交處理
1、問題
今天boss告訴我，他昨天測試的時候，發現碰了一下表單的儲存按鈕，老是儲存多條資料到資料庫。聽到這個訊息，我當時無語了，對自己無語了，忘了控制資料的重複提交問題了。我們在做開發的時候，測試一般都在本地進行，一般不會出現網速慢導致延遲等問題。所以一般點選儲存，只要不會出現業務邏輯問題，一般都會成功儲存，但是我們忽略了一個問題，當在外網的時候，網路會出現各種問題導致延遲，這是使用者往往會點選提交儲存，嗨！奇怪怎麼沒反應，然後再點選一次，甚至多次，這樣，往往會導致多條相同的資料儲存到資料庫中去。這就是我們軟體開發界的一個普遍而常見的問題，資料重複提交問題。對於這種問題，我們不能忽略，而是要在前後臺做嚴格的控制和處理。
2、解決
我用的easyui技術，表單提交用的ajax。在前端處理控制的思想如下：
點選儲存後，馬上讓儲存按鈕disable掉，即灰顯。如果ajax提交完畢後，並得到返回結果（不管結果是成功儲存還是儲存失敗，我們不用管，只要有返回訊息），我們馬上讓儲存按鈕enable掉，重新恢復作用。
3、程式碼
var addStores = $('<div/>').dialog(
{
title : '新增門店',
href : '${pageContext.request.contextPath}/admin/storesAdd.jsp',
width : 615,
height : 365,
modal : true,
buttons : [ {
text : '儲存',
handler : function() {
var button = this;
$('#admin_stores_addForm').form('submit',{
url : '${pageContext.request.contextPath}/storesAction!add.action',
onSubmit: function(){ //對錶單進行校驗，如果校驗通過，則disable掉儲存按鈕，如果沒有通過，則不用管。
var isValid = $(this).form('validate');
if (!isValid){
console.info("==========================="+isValid)//$.messager.progress('close');
return isValid;
}else {
console.info("111111111111111111111111111111"+isValid);
$(button).linkbutton('disable');
return isValid; // return false will stop the form submission
}
},
success : function(r) {
$(button).linkbutton('enable'); //提交完，並且處理完畢返回訊息後，馬上恢復掉儲存按鈕，enable
obj = $.parseJSON(r);
if (obj.success) {
addStores.dialog('close');
storesdatagrid.datagrid('reload');
}
$.messager.show({
title : '提示',
msg : obj.msg
});
}
});
}
} ],
onClose : function() {
$(this).dialog('destroy');
},
onLoad : function() {
}
});
4、本來還有個方法，但是我沒有嘗試，不曉得有沒有用，先在這裡記一筆，就是用ajax的最原始的處理方法，不是像上面的那種，進行封裝過。
jQuery.ajax([options])
async Boolean
(預設: true) 預設設定下，所有請求均為非同步請求。如果需要傳送同步請求，請將此選項設定為 false。注意，同步請求將鎖住瀏覽器，使用者其它操作必須等待請求完成才可以執行。