当前位置: 代码迷 >> 综合 >> 前台:Ajax获取动态表格输入的数据 JSON传数据 后台:获取json数据转化类对象进行数据库操作
  详细解决方案

前台:Ajax获取动态表格输入的数据 JSON传数据 后台:获取json数据转化类对象进行数据库操作

热度:98   发布时间:2024-01-31 04:51:46.0

前台jsp
$(function(){  
$("#btn").click(function(){
var num=$("#tb tr").size();//获取表格ID为tb中的行数
var arr=new Array(num);//创建对象数组
var zongid =$("#zongid").val();
var nian =$("#nian").val();

//使用 $("#tb tr:eq("+i+") select[name='月份name']").val() 获取select中的内容

// id为tb行数   1 ,位置:eq确认哪一行   2,数据:类型[name=' '].val()  取数据

//使用 $("#tb tr:eq("+i+") :text[name='input的name']").val() 获取input中的内容
for(var i=0;i<arr.length;i++){
arr[i]={"zongid":zongid,"nian":nian,"yue":$("#tb tr:eq("+i+") select[name='yue']").val(),"dzhao":$("#tb tr:eq("+i+")                                         :text[name='dzhao']").val(),
"dkong":$("#tb tr:eq("+i+") :text[name='dkong']").val(),"ddong":$("#tb tr:eq("+i+") :text[name='ddong']").val(),
"dzong":$("#tb tr:eq("+i+") :text[name='dzong']").val(),"dyue":$("#tb tr:eq("+i+") :text[name='dyue']").val(),
"sliang":$("#tb tr:eq("+i+") :text[name='sliang']").val(),"sfei":$("#tb tr:eq("+i+") :text[name='sfei']").val(),
"tliang":$("#tb tr:eq("+i+") :text[name='tliang']").val(),"tfei":$("#tb tr:eq("+i+") :text[name='tfei']").val(),
"zliang":$("#tb tr:eq("+i+") :text[name='zliang']").val(),"zfei":$("#tb tr:eq("+i+") :text[name='zfei']").val()};                 
}//循环获取信息

                 //封装JSON
var jsondata = JSON.stringify(arr);

                //ajax 开始发送异步请求
$.ajax({
"url":"#,
"type":"POST",
"data":{"jsondata":jsondata},
"dataType":"text",
//成功之后回来的数据
success:function(queRen){
if(queRen == arr.length){
alert("提交成功!");
}else {
alert("提交失败!");
}                      
},
erroe:function(){
alert("服务器端出现错误!");
}
});
});

});

 

html文本

 <tbody  id="tb">
<tr >
<td>
<select name="yue">
<option value="1">月</option>          
</select>           
</td>
<td><input class="Shuzi" type="text" name="dzhao"  required="required"/></td>
<td><input class="Shuzi" type="text" name="dkong"  required="required"/></td>
<td><input class="Shuzi" type="text" name="ddong"  required="required"/></td>
<td><input class="Shuzi" type="text" name="dzong"  required="required"/></td>
<td><input class="Shuzi" type="text" name="dyue"  required="required" /></td>
<td><input class="Shuzi" type="text" name="sliang"  required="required" /></td>
<td><input class="Shuzi" type="text" name="sfei"  required="required"/></td>
<td><input class="Shuzi" type="text" name="tliang"  required="required"/></td>
<td><input class="Shuzi" type="text" name="tfei"  required="required"/></td>
<td><input class="Shuzi" type="text" name="zliang"  required="required"/></td>
<td><input class="Shuzi" type="text" name="zfei"  required="required"/></td>           
</tr>

       <input type="button" id="btn" value="提交" />

后台servlet 

//需要导入阿里巴巴的jar包

import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;  

PrintWriter out =response.getWriter();//可能乱码问题
String jsondata =request.getParameter("jsondata");

//ajax传只能传json字符串 后台需要把json字符串转化成json对象数组JSONArray.parseArray(json字符串);

//fastjson.jar 提供的JSON.toJavaObject(obj,类.class); json对象转化为类对象

JSONArray arr =JSONArray.parseArray(jsondata);
int result =0;//数据库操作单个月份是否成功
int record =0;//记录成功次数
BillBiz billBiz =new BillBizImpl();
for(int i=0;i<arr.size();i++){
JSONObject obj =arr.getJSONObject(i);
Bill bill =JSON.toJavaObject(obj, Bill.class);//json对象转类对象Bill.class
result =billBiz.addBills(bill);//添加的方法
if(result ==1){
record++;
}else{
out.print(0);
}
}
//结果的判断

        if(record ==arr.size()){

           out.print(record);

        } else{

            out.print(0);

        }

 

  相关解决方案