JQuery中的ajax应用

$(".btn").click(function(){

        //把数据提交，实际是通过ajax的方式去提交数据到服务器

        var sdata = $("form").serialize();//对表单的数据进行序列化

        var url = "reg.do?"+sdata;

        $.ajax({

        type: "GET",

        url: url,

        success: function(data){

        $("#info tr:not(:first)").remove();

          for(var i in data){ //i表示的是索引

          var str ="<tr><td>"+data[i].userName+"</td><td>"+data[i].userPwd+"</td></tr>";

             $("#info").append(str);

          }

        },

        dataType:"json"  //设置返回的数据格式为json对象

 

              });

        });   

 

相应的服务器端的servlet处理（由于需要加入json的序列化，所以需要引入相应的jar包），相应的代码：

 

req.setCharacterEncoding("UTF-8");

 

         resp.setCharacterEncoding("utf-8");//处理的是返回字符串的乱码

       //resp.setContentType("text/html,charset=gbk");

 

     String userName = req.getParameter("txtUserName");//用户名

 

     String userPwd = req.getParameter("txtUserPwd");//用户密码

 

     String userEmail = req.getParameter("txtUserEmail");//用户Email

 

     String userReason = req.getParameter("txtUserReason");//注册原因

 

     String userAddress = req.getParameter("txtUserAddress");//居住地址

 

     UserInfo u = new UserInfo();

 

     u.setUserName(userName);

 

     u.setUserPwd(userPwd);

 

     u.setRegReason(userReason);

 

     u.setUserEmail(userEmail);

 

     u.setUserAddress(userAddress);

 

     UserInfoService userService = new UserInfoService();

 

     try {

 

if(userService.userReg(u)){//注册成功，

 

List<UserInfo> list = userService.getList();

 

//序列化的操作

 

JSONArray jsonArray = JSONArray.fromObject(list);

 

   String strInfo = jsonArray.toString();//把集合对象转换成json的字符串

 

   System.out.println(strInfo);

 

   PrintWriter pw = resp.getWriter();

 

   pw.print(strInfo);

 

}

 

} catch (SQLException e) {

 

// TODO Auto-generated catch block

 

e.printStackTrace();

 

}