171202之ajax提交整個form表單 一

2021-08-11 16:33:21 字數 1215 閱讀 7373

簡介:

ajax提交form表單在專案中經常用到,前台無論是簡單的html、jsp或者使用了easyui框架,提交表單都會使用到ajax。

總的來說,ajax提交表單可以分為兩種,一種是無返回結果的,就是把表單資料提交給後台,後台處理完就完了;另一種就是返回有結果的,後台執行成功或者失敗的資訊需要返回到前台。

1:無返回結果的

最簡單的就是$(「#formid」).submit();直接將form表單提交到後台。

2:有返回結果的

這種方式是使用最多的一種,因為程式的執行成功與否都需要給使用者提示,程式一般也都是多步完成的,執行完插入操作,需要發起流程,這就需要在介面上判斷成功與否。ajax本身屬於有返回結果的一類,其中的success方法就是處理後台返回結果的。

ajax提交表單有返回結果的有兩種實現方式:

1:將form表單資料序列化

"font-size:18px;">  $.ajax(,  

success: function

(data)

});span>

這種方法需要注意的是form表單中的項一定要有name屬性,後台獲取的鍵值對為key=name值,value=各項值,注意:無論是input標籤還是span標籤或者其他標籤,一定要有name屬性,沒有name屬性後台是獲取不到該項的。

2:通過視窗查詢form提交

"font-size:18px;">  // 提交表單  

var obj = document.getelementbyid("xx_iframe").contentwindow;

obj.$("#yourform").form("submit",

});span>

因為在當前介面上彈出對話方塊,然後在對話方塊上的按鈕觸發對話方塊中表單提交,對話方塊又是鏈結的另外的html頁面,如此通過$(「#formid」)的方式是找不到對話方塊中的form的,因此這種情況下只能使用這種方式提交表單。

另外ajax中封裝的get,post請求也都屬於有返回結果的一類。

總結:無返回結果的和有返回結果的(將form表單資料序列化+通過視窗實現form提交),form表單必須要有name屬性

**:

171202之ajax提交整個form表單 二

表單提交方法有三種,主要說下第三種 第一種 用 form 自帶屬性action 提交 第二種 用 jquery 提交 formid submit jquery提交表單有兩種情況 1 jquery只做提交用。form submit 這個的表單提交到什麼地方的是更具form元素裡面的action屬性去定...

171202之ajax提交整個form表單 三

方法二 使用jquery.form.js jquery.form.js是乙個強大的表單外掛程式,其大量的提供了表單操作的各種簡便的方法,下面給出一些jquery.form.js的說明 它也支援對乙個表單的ajax提交,而且提交方式更為簡便,如下 html 下面使用jquery.form.js的表單外...

Ajax提交整個表單

在專案開發中,有時提交form表單時不能單單用action或者jquery的 表單提交方法有三種,主要說下第三種第一種 用form自帶屬性action提交第二種 用jquery提交 formid submit 第三種 用ajax提交 但如果form表單中資料很多時,不可能一一列出,只需要用 your...