通过ajax将list传到后台的两种实现方式

最近在做用easyui的datagrid将数据批量上传到后台的功能，在这个时候由于对象的属性中有一个字段是list属性，那么就涉及到如何将list便利好传到后台进行数据处理，

在这里我给出两种实现方案：

一：通过前台JS将其便利后上传，此时要注意，这里的data{}属性不能再上传其他的参数，否者会上传失败，如要将其他参数也一同上传，则需要将这些参数放到URL

中进行上传，下面给出JS的具体实现：

//具体收费条例：

var collectCharge = function(){
var pay_amount = $('#paidAmount').val();
if(pay_amount=="" || pay_amount==undefined){
alert('请输入收费金额');
}else{
var owner_name = $('#ownerName').val();
var detailList = {};
var rows = $('#collectFeeGrid').datagrid('getRows');//获得datagrid所有行；
if(rows=="" || rows==null || rows==undefined){
$.messager.alert("操作提示", "没有收费信息，请核对后收费！");
}else{

// 这里是获取对象的其他属性
var param_value = $('#param_value').val();
var paid_amount = $('#pay_amount').text().replace("元","");
var delete_zero = $('#zero').val()=="" ? 0 : $('#zero').val().replace("元","") ;//由于收费金额是带字符串 ‘元’所以这里讲其去掉；
var pay_amount = $('#total').text().replace("元",""); 
var total_paid_amount =  parseFloat(paid_amount)+parseFloat(delete_zero);//JS中数字的相加要对其进行转换才进行相加，否者变成字符串的相加；
var pay_Type = $('#pay_Type').combobox('getValue');
var residence_code = $('#residenceCode').val();

// 核心代码将list进行便利
for (var i = 0; i < rows.length; i++) {
   var row = rows[i];            
   detailList["detailList[" + i + "].kjkm"] = rows[i].kjkm;
   detailList["detailList[" + i + "].start_time"] = new  Date(rows[i].start_time).format('yyyy-MM-dd'); //由于时间格式是时间戳，这里将其转换为字符串的格式
   if(rows[i].end_time=="NaN-aN-aN" || rows[i].end_time==undefined){
    detailList["detailList[" + i + "].end_time"] = new  Date(new Date()).format('yyyy-MM-dd');//由于后台数据不能为空，这里对于为空的数据进行处理
   }else{
    detailList["detailList[" + i + "].end_time"] = new  Date(rows[i].end_time).format('yyyy-MM-dd');
   }
   detailList["detailList[" + i + "].pay_amount"] = rows[i].pay_amount;
   detailList["detailList[" + i + "].residence_code"] = rows[i].residence_code;
   detailList["detailList[" + i + "].calcullate_way"] = rows[i].calcullate_way; 
   detailList["detailList[" + i + "].paid_amount"] = rows[i].pay_amount;
   detailList["detailList[" + i + "].source_no"] = rows[i].source_no;
   detailList["detailList[" + i + "].param_type"] = rows[i].param_type;
   if(rows[i].count==undefined || rows[i].count == 0){
  detailList["detailList[" + i + "].count"] =1;
  }else{
  detailList["detailList[" + i + "].count"] = rows[i].count; 
  }
}
$.ajax({
   url: DOMAIN_URL + "/wyfeeCollection/savaData.do?delete_zero=" +delete_zero// 这里是在URL传多个属性的写法
   +"&paid_amount=" +paid_amount +"&pay_amount=" +pay_amount+
   "&owner_name=" + owner_name +"&pay_type=" +pay_Type +"&room_code=" +residence_code, 
   data: detailList,// 这里的data上传的就是 对象属性的list，JS将其遍历成数组上传
   dataType: "json",
   type: "POST",          
   success: function (result) {
var rsObj = typeof result === "object" ? result : $.parseJSON(result);
var title = rsObj.status === 0 ? "操作成功" : "操作失败";
if (rsObj.status === 0) {
$.messager.alert(title, rsObj.responseDescription, 'info');           
} else {
$.messager.alert(title, rsObj.responseDescription, 'error');
}
}
});  
}
}
}

那么到此，第一种方法的JS处理就这样，至于后台要实现什么功能就看各自的需求了；

二：将需要上传的list转换为json字符串对象，后台通过jsonArray将其转换为JSONArray.fromObject（）的形式，然后再将其进行遍历，那么这个时候在前台处理就比较简单，以下给出详细的实现：

具体参数上面都已经写过，这里只给出ajax的操作：

$.ajax({
url : DOMAIN_URL + "/wyfeeCollection/savaData.do",
data :{
pay_type:pay_type,
   owner_name:owner_name,
   details_json:JSON.stringify(rows), //此处是重点 通过JSON.stringify（）将这个list转换为json对象的字符串格式提交到后台
   room_code : residence_code,
   delete_zero : delete_zero,
   paid_amount :paid_amount,
   pay_amount : pay_amount,
   yh_way : yhq_id,
   yh_amount : yh_amount,
},
type:"post",

 success: function (result) {
var rsObj = typeof result === "object" ? result : $.parseJSON(result);
var title = rsObj.status === 0 ? "操作成功" : "操作失败";
if (rsObj.status === 0) {
$.messager.alert(title, rsObj.responseDescription, 'info');            
} else {
$.messager.alert(title, rsObj.responseDescription, 'error');
}
}
});  

接下来就是后台的处理了，不多说 直接上代码：

@RequestMapping("savaData.do")
@ResponseBody
public void saveData(WyFeeRecordPO po,String details_json,HttpServletRequest request, HttpServletResponse response,HttpSession session) throws ParseException{
JSONArray json = JSONArray.fromObject(details_json);// 这里将拿到的list将其转化为json对象；
if (json.size()>0) {
for(int i=0;i<json.size();i++){
JSONObject job = json.getJSONObject(i); 
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");//如果涉及到时间的格式转换，这里就是最大的麻烦，如果不涉及时间，就不用处理
if (job.get("end_time")!=null) {
String end_time = sdf.format( job.get("end_time"));
Date end_date = sdf.parse(end_time);
job.put("end_time", end_date);
}else {
job.put("end_time", new Date());
}
String start_time = sdf.format( job.get("start_time"));
Date start_date = sdf.parse(start_time);
job.put("start_time", start_date);
}
}

// 此处还需将json对象进行一次转换，和实体类相关联
@SuppressWarnings("unchecked")
List<WyFeeRecordDetailPO> list = (List<WyFeeRecordDetailPO>)JSONArray.toCollection(json, WyFeeRecordDetailPO.class);
List<WyFeeRecordDetailPO> detailList = new ArrayList<WyFeeRecordDetailPO>();
for (WyFeeRecordDetailPO detailPO : list) {// 这里将数据遍历出来放到实体类中；
detailPO.setCalcullate_way(detailPO.getCalcullate_way());
detailPO.setKjkm(detailPO.getKjkm());
detailPO.setResidence_code(detailPO.getResidence_code());
detailPO.setCount(detailPO.getCount());
detailPO.setStart_time(detailPO.getStart_time());
detailPO.setEnd_time(detailPO.getEnd_time());
detailPO.setParam_type(detailPO.getParam_type());
detailPO.setOrder_no(detailPO.getOrder_no());
detailPO.setPaid_amount(DoubleCalcUtil.sub(detailPO.getPay_amount(), po.getYh_amount()));
detailPO.setPay_amount(detailPO.getPay_amount());
detailPO.setYh_way(po.getYh_way());
detailPO.setYh_amount(po.getYh_amount());
detailList.add(detailPO);
}
po.setPay_channel(1);//剩下的这些为业务处理，不做参考
po.setPay_time(new Date());
po.setDetailList(detailList);
session.setAttribute("recordPo", po);
ResponseHeader responseData = handleService.createOrderData(po);
if(responseData.getResponseCode().equals(ResponseCodeEnum.SUCCESSED.getStatus())){
responseData = handleService.updateOrderState(po);
}
ResponseUtil.responseJson(response, responseData);
}