form表单以ajax提交,并且对提交的参数进行自定义
2016-11-01 14:43
393 查看
我想将表单中没有值的字段填值,首先表单序列化得到一个String类型的值,每个字段以&分隔,用split方法将字符串转换成数组,代码如下
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表单代码
$("#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>
相关文章推荐
- 通过Ajax方式提交form表单上传文件,使用FormData进行Ajax请求
- form表单提交和ajax表单提交,关于移动端如何通过软键盘上的【搜索】和【前进】进行提交操作
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- 使用ajax 提交多个form表单以及其他参数
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- Jquery 获取表单FORM所有元素进行AJAX提交
- 如果一个button被用于触发ajax,那就不能再用它进行form表单提交了
- Jquery基于Ajax方法自定义无刷新提交表单Form实例
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- 关于Jquery 获取表单FORM所有元素进行AJAX提交
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- Spring MVC 多图片上传 ajax form表单 参数 提交后台
- spring mvc 配合ajax进行表单提交(有文件上传)并且提醒用户提交成功
- 手机号验证,为jquery-validation添加自定义验证方式,以及Ajax提交form表单
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- 当button按钮放入form表单进行ajax提交遇到的诡异问题
- form 表单序列化参数,ajax提交