将form表单里的数据封装成对象 json2.js的例子 jquery的serialize方法转换空格为+号的解决方法

将form表单里的数据封装成json对象即object，在后台中用usr就能接收全部参数了。可适用于strts2，easyUI的DataGrid 传参等

需要引用的js库有jquery 和 json2.js

<form id="fm" >

<input type="text"   name="username"  value="zhangsan" ><BR><BR>
<input type="text"   name="age"  value="12" ><BR><BR>
<input type="text"   name="address"  value="北京  朝阳" ><BR><BR>
<input type="text"   name="job"  value="IT" ><BR><BR>
<textarea name="content">abc + 123 + 456  </textarea>
<input type="button"  value="发送"  onclick="add()" ><BR><BR>

</form>

<script type="text/javascript">

function add(){
var aa= $('#fm').serialize();
alert(aa); // + 号显示多个
var bb=aa;
//关于jquery的serialize方法转换空格为+号的解决方法
bb = aa.replace(/\+/g," ");   // g表示对整个字符串中符合条件的都进行替换
bb = decodeURIComponent(bb);  //对serialize后的内容进行解码
alert(bb);
}

function conveterParamsToJson(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;
}

function queryParamByFormId(form) {
var formValues = $("#" + form).serialize();

//关于jquery的serialize方法转换空格为+号的解决方法
formValues = formValues.replace(/\+/g," ");   // g表示对整个字符串中符合条件的都进行替换
var temp = JSON.stringify(conveterParamsToJson(formValues));
var queryParam = JSON.parse(temp);
return queryParam;
}

</script>

easyUI的DataGrid 的例子

function loadGrid() {

var queryParams=queryParamByFormId("queryform");
alert(queryParams.username);
//加载数据
$('#list_data').datagrid({
queryParams:queryParams,
loadMsg : '数据加载中请稍后……',
pagination : true,//显示分页
pageSize : 5,//分页大小
pageList : [ 5, 10, 15, 20 ],//每页的个数
fit : true,//自动补全
fitColumns : true,
//iconCls : "icon-save",//图标
//title : "用户",
width : 'auto',
height : 'auto',
collapsible : false,//是否可折叠的
fit : true,//自动大小
url : 'userAction_query.action',
remoteSort : false,
singleSelect : true,//是否单选
pagination : true,//分页控件
rownumbers : true,//行号
columns : [ [ //每个列具体内容
{field : 'ck',checkbox : true},
{field : 'USERCODE',title : '用户代码',width : 100,editor:'text'},
{field : 'USERNAME',title : '用户名称',width : 100,editor:'text'},
{field : 'VALIDSTATUS',title : '是否有效',width : 100,editor:'text'}

] ]
});
}