通常,在提交字段較少的form中,我們可以在控制層直接用多字段參數去接收。但在字段較多,比如一個from表單中包含十幾個甚至二十幾個字段時,控制層再用單個字段來一個一個接收的話,參數就會非常多,並且代碼可讀性也大大降低。因此將字段封裝成對象,再將對象傳回控制層,就大大簡化了代碼。具體方法如下:
HMTL:
<form id="tempForm">
<div class="row">
<label>系統編碼:</label>
<input type="text" name="invSys">
</div>
<div class="row">
<label>系統名稱:</label>
<input type="text" name="sysName">
</div>
<div class="row">
<label>系統類型:</label>
<input type="text" name="sysType">
</div>
<div class="row">
<label>狀 態:</label> <select name="state">
<option value="1">有效</option>
<option value="0">無效</option>
</select>
</div>
<div class="row">
<label>定義人員:</label>
<input type="text" name="confStaff">
</div>
<div class="row">
<label>操作時間:</label>
<input type="text" name="confDate">
</div>
<div class="row">
<input value="保存" type="button" onclick="update();">
</div>
</form>
JavaScript:
function serializeForm(a) {// 參數爲form標籤
var resultJson = {};// 要傳遞給後臺的對象數據
var array = a.serializeArray();// 序列化表單內容
$(array).each(function() {
resultJson[this.name] = this.value.trim();
});
}
在序列化form時,使用的是serializeArray(),得到的是一個對象數組,並不是我們最終想要的對象,格式爲 [ { name : invSys , value : invSysValue } , ... ] 。因此需要對這個對象數組進行處理,封裝成我們所需要的 { invSys : invSysValue , ... } 這樣格式的對象,使用了循環。