您的位置:首页 > Web前端 > JavaScript

form表单以ajax提交,并且对提交的参数进行自定义

2016-11-01 14:43 393 查看
我想将表单中没有值的字段填值,首先表单序列化得到一个String类型的值,每个字段以&分隔,用split方法将字符串转换成数组,代码如下

$("#saveUpdate").click(function() {
var node = $('#tree').tree('getSelected');//我要添加的值
var parentOne = $('#tree').tree('getParent', node.target);//我要添加的值
var data = $("#updateForm").serialize();//序列化表单
var arr = data.split("&");//转换成字符数组
var newArr = new Array();//用来存储转换后的数组
for(var i=0;i<arr.length;i++){
if(arr[i] == "id="){//若ID为空,给ID重新赋值
arr[i] = "id="+node.id;
}else if(arr[i] == "folder_parent_id="){//若文档父ID为空,重新赋值
arr[i] = "folder_parent_id="+parentOne.id;
}
newArr[i] = arr[i];
}
var resultArr = newArr.join("&");//添加&分隔符
if ($("#updateForm").form("validate")) {//核验是否存在不符合条件的字段
$.ajax({
type : 'post',
url : "${pageContext.request.contextPath }/document/updateNodes",
data : JSON.stringify(conveterParamsToJson(resultArr)),
dataType : 'json',
contentType : "application/json; charset=utf-8",
success : function(data) {
if (data.flag) {
$('#tree').tree('reload');
$.messager.alert('更新成功',data.msg,"info");
} else {
$.messager.alert('更新失败',data.msg,"error");
}
}
});
} else {
return;
}
$('#updateWindow').window("close");
});

convetParamsToJson方法

//对象转json
function conveterParamsToJson(paramsAndValues) {
paramsAndValues = paramsAndValues.replace(/\+/g," "); //
paramsAndValues = decodeURIComponent(paramsAndValues);

var jsonObj = {};
var param = paramsAndValues.split("&");
for ( var i = 0; param != null && i < param.length; i++) {
var para = param[i].split("=");
jsonObj[para[0]] = para[1];
}

return jsonObj;
}

form表单代码

<div class="easyui-window" title="update window" id="updateWindow" collapsible="false" minimizable="false" maximizable="true"
closed="true" style="top: 20px; left: 200px">
<div region="north" style="height: 31px; overflow: hidden;"
split="false" border="false">
<div class="datagrid-toolbar">
<a id="saveUpdate" icon="icon-save" href="#" class="easyui-linkbutton"
plain="true" style="color: green; font-size: 15px"> <b>submit</b></a>
</div>
</div>

<div region="center" style="overflow: auto; padding: 6px;">
<form id="updateForm" action="#">
<table class="table-edit" width="95%" align="center">
<tr class="title" style="font-size: 15px">
<th colspan="2"
style="font-size: 18px; height: 40px; padding-left: 25px;">更新目录
<input type="hidden" name="id" id="Id" />
<input type="hidden" name="is_deleted" />
<input type="hidden" name="create_time" />
<input type="hidden" name="folder_parent_id" />
</th>
</tr>
<tr>
<th style="height: 35px">文件名</th>
<th><input type="text" name="folder_name" class="easyui-validatebox" data-options="required:true,validType:'multiple[\'length[1,8]\',\'RegeMatch\']'"  invalidMessage="必输1~8个字符或存在非法字符"/></th>
</tr>
<tr>
<th>文件类型</th>
<th><input type="text" name="folder_type" class="easyui-validatebox" data-options="required:true,validType:'multiple[\'length[1,8]\',\'RegeMatch\']'"  invalidMessage="必输1~8个字符或存在非法字符"/></th>
</tr>
</table>
</form>
</div>
</div>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  easyui javascript 遍历