将整个网页的数据上传至数据库 (底部是N行数据一次性传给后台)

[人生如若初遇见]

由于我是小白 才学习两个月的js和php,提交数据只会基本form表单提交，我查阅资料把思路给理清楚了 就是不知道代码怎么去写

1丶前台封装数据（json）
怎么去封装
2丶格式化数据
3丶异步提交数据（ajax）
这个我知道
4丶后台解析数据保存到数据库

我不需要你帮我完成，我只想知道有没有这么一个列子 我看一下代码是怎么写的，因为才学两个月很多东西都不是很了解，该用什么不改用什么完全不知道

[caox_nazi]

点击提交按钮，上面是一个json对象，下面多条数据的表格可以分为另外一个json对象

//封装数据的对象  
    var PayObj =    
       {    
         O_NBR:"",      
         P_NBR:"",    
         O_AMOUNT:""  ,  
         P_DT:"",  
         P_HL_ZH:"",  
         P_PAY_TYP:"",  
         P_POS:"",  
         P_U_ZH:"",  
         P_U_HM:"",  
         P_ATTR_IMGS:"",  
         P_RECEIPT_NBR:""  
       }  

// JSON字符串转换JSON对象
var a = JSON.parse("{\"title\":\"\",\"data\":[]}"); 

比如点击保存按钮触发这个方法获取到上面你的每一个值的，这里只写出你要传下面那个table的多个值

function getChecked() {  
        $(选择器).each(function() {  
// 遍历table每一行数据 传给json对象
            var PayObj = new Object();  
           
            PayObj.requestTransNo = ;  
            PayObj.cardNo = ;  
            PayObj.cardUser =  ;  
            PayObj.dealDate =;  
            PayObj.orderId =   
            PayObj.tranNo =;  
            PayObj.refundAmt =;  
            PayObj.refundReason = document.getElementById('refundReason').value;  
      
            a.data.push(PayObj);//向JSON数组添加JSON对象的方法；很关键  
        });  

}  

///格式化数据  
var obj=JSON.stringify(a);//这一行很关键  

// 异步提交数据
$.ajax({  
        type: "post",  
        url : "${ctx}/refund/transferPaymentReback/ajaxRefundTransferPaymentReback.do",  
        dataType: "json",  
        cache: true,  
        data:{'param':obj},  
        success: function (data) {  
            $("#doSave").attr("disabled",false);  
            showAlertMsg(data.flag.errorMsg, {  
                closeFunction: function () {  
                    if (data.flag.success == true) {  
                        window.location.href="${ctx}/member/relation/bankOfHuaXiaManager.do"  
                    }  
                }  
            });  
        },  
        error: function () {  
            $("#doSave").attr("disabled",false);  
            alertMsg(null, false, null, null, "调用接口失败，请稍后重试!");  
        }  
    });

//后台解析接收数据
String param = request.getParameter("param");  
        JSONObject json=JSONObject.fromObject(param);  
        List<Map<String,String>> payList=json.getJSONArray("data"); 

[htcyrylcmj0415]

1前台封装数据,封装的时候就格式化了

function getJson(){
	    var arr = new Array();
        $(".table tr.row").each(function (i, e) {//每一行,选择器自己修改
            var row = {};
            $(e).find("textarea,input,select").each(function (ii, ee) {//每行里面需要提交的数据
                var input = $(ee);
                var obj = {};
                obj["value"] = input.val();
                obj["seq"] = input.next().val();
                row[input.attr("name")] = obj;
            });
            arr.push(row);
        });
        return JSON.stringify(arr);
    }

上面获取到JSON串之后赋值给页面的hidden,最后form提交,或者不用赋值hidden直接ajax提交也可以 4后台解析

String rowJson = request.getParameter("rowJson") == null ? "" : request.getParameter("rowJson");
JSONArray rowJsonArr = JSONArray.fromObject(rowJson);

之后遍历rowJsonArr,把值写入对应的实体 然后写入数据库

[人生如若初遇见]

[quote=引用 1 楼 htcyrylcmj0415 的回复:] 1前台封装数据,封装的时候就格式化了

function getJson(){
	    var arr = new Array();
        $(".table tr.row").each(function (i, e) {//每一行,选择器自己修改
            var row = {};
            $(e).find("textarea,input,select").each(function (ii, ee) {//每行里面需要提交的数据
                var input = $(ee);
                var obj = {};
                obj["value"] = input.val();
                obj["seq"] = input.next().val();
                row[input.attr("name")] = obj;
            });
            arr.push(row);
        });
        return JSON.stringify(arr);
    }

我问一下 上面是一个div下面另外一个div也这个这样做嘛 然后用ajax提交？ 我基础太差了很多东西都不是很懂 都是边做边学

[htcyrylcmj0415]

引用 2 楼 weixin_41872184 的回复:

[quote=引用 1 楼 htcyrylcmj0415 的回复:] 1前台封装数据,封装的时候就格式化了

function getJson(){
	    var arr = new Array();
        $(".table tr.row").each(function (i, e) {//每一行,选择器自己修改
            var row = {};
            $(e).find("textarea,input,select").each(function (ii, ee) {//每行里面需要提交的数据
                var input = $(ee);
                var obj = {};
                obj["value"] = input.val();
                obj["seq"] = input.next().val();
                row[input.attr("name")] = obj;
            });
            arr.push(row);
        });
        return JSON.stringify(arr);
    }

我问一下 上面是一个div下面另外一个div也这个这样做嘛 然后用ajax提交？ 我基础太差了很多东西都不是很懂 都是边做边学

是的,排版看你需求改,前台封装数据就是根据table tr遍历组装的,然后ajax提交后台