ajax和json跟java实现List、Map直接传递

1 篇文章 0 订阅

ajax和json跟java实现List、Map直接传递
由于项目需要通过ajax得到后台的List对象里面的值,由于没有接触过json所以前期我只能先传字符串再在js里截取子串实现。闲暇时间摸索了一下关于json接受List对象的方法,步骤如下:
1.首先下载json所以依赖的包, Json-lib 最新版 json-lib-2.3-jdk15.jar,其官方网站是: http://json-lib.sourceforge.net/可以直接download,细心的你会发现其网站页面里面有提示它还需要其他包:
Json-lib requires (at least) the following dependencies in your classpath:
•jakarta commons-lang 2.4
•jakarta commons-beanutils 1.7.0
•jakarta commons-collections 3.2
•jakarta commons-logging 1.1.1
•ezmorph 1.0.6
下载地址分别是:
http://commons.apache.org/lang/
http://commons.apache.org/beanutils/
http://commons.apache.org/collections/
http://commons.apache.org/logging/
http://ezmorph.sourceforge.net/
2.首先先见一个小web项目
先建一个User类:
Java代码 复制代码  收藏代码
  1. package com.json;  
  2.   
  3. public class User {  
  4.     String username;  
  5.     String password;  
  6.     public String getUsername() {  
  7.         return username;  
  8.     }  
  9.     public void setUsername(String username) {  
  10.         this.username = username;  
  11.     }  
  12.     public String getPassword() {  
  13.         return password;  
  14.     }  
  15.     public void setPassword(String password) {  
  16.         this.password = password;  
  17.     }  
  18.       
  19. }  
package com.json;

public class User {
    String username;
    String password;
	public String getUsername() {
		return username;
	}
	public void setUsername(String username) {
		this.username = username;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
    
}

再建一个servlet
Java代码 复制代码  收藏代码
  1. package com.json;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5. import java.util.ArrayList;  
  6. import java.util.List;  
  7.   
  8. import javax.servlet.ServletException;  
  9. import javax.servlet.http.HttpServlet;  
  10. import javax.servlet.http.HttpServletRequest;  
  11. import javax.servlet.http.HttpServletResponse;  
  12.   
  13. import net.sf.json.JSONArray;  
  14.   
  15. public class TestJson extends HttpServlet {  
  16.   
  17.     public void doGet(HttpServletRequest request, HttpServletResponse response)  
  18.             throws ServletException, IOException {  
  19.            doPost(request,response);  
  20.     }  
  21.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
  22.             throws ServletException, IOException {  
  23.   
  24.         response.setContentType("text/html");     
  25.     String str= request.getParameter("name");//得到ajax传递过来的paramater  
  26.         System.out.print(str);  
  27.         PrintWriter out = response.getWriter();  
  28.         List list = new ArrayList();//传递List  
  29.                   Map m=new HashMap();//传递Map      
  30.         User u1=new User();  
  31.         u1.setUsername("zah");  
  32.         u1.setPassword("123");  
  33.         User u2=new User();  
  34.         u2.setUsername("ztf");  
  35.         u2.setPassword("456");    
  36.         list.add(u1); //添加User对象        
  37.          list.add(u2);     //添加User对象    
  38.         
  39.           m.put("u1", u1);  
  40.          m.put("u2", u2);     
  41.   
  42.    JSONArray jsonArray2 = JSONArray.fromObject( list );  
  43.        //把java数组转化成转化成json对象   
  44.    JSONObject jo=JSONObject.fromObject(m);//转化Map对象  
  45.         out.print(jsonArray2);//返给ajax请求  
  46.        out.print(jo);//返给ajax请求  
  47.     }  
  48. }  
  49.   
  50. 配置好web.xml中的servlet映射,这一步就略了。  
package com.json;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;

public class TestJson extends HttpServlet {

	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
           doPost(request,response);
	}
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		response.setContentType("text/html");	
	String str=	request.getParameter("name");//得到ajax传递过来的paramater
		System.out.print(str);
		PrintWriter out = response.getWriter();
		List list = new ArrayList();//传递List
                  Map m=new HashMap();//传递Map    
		User u1=new User();
		u1.setUsername("zah");
		u1.setPassword("123");
		User u2=new User();
		u2.setUsername("ztf");
		u2.setPassword("456");	
        list.add(u1); //添加User对象      
         list.add(u2);     //添加User对象  
      
          m.put("u1", u1);
         m.put("u2", u2);   

   JSONArray jsonArray2 = JSONArray.fromObject( list );
       //把java数组转化成转化成json对象 
   JSONObject jo=JSONObject.fromObject(m);//转化Map对象
        out.print(jsonArray2);//返给ajax请求
       out.print(jo);//返给ajax请求
	}
}

配置好web.xml中的servlet映射,这一步就略了。



3.建立ajax实现
这里为了快速实现用的是jquery实现的。
Java代码 复制代码  收藏代码
  1. <script type="text/javascript" src="js/jquery.js"></script>  
  2.  <script type="text/javascript">  
  3.      function test(){  
  4.          $.ajax({   
  5.                 type:"POST"//请求方式  
  6.                 url:"testjson"//请求路径  
  7.                 cache: false,     
  8.                 data:"name=zah",  //传参  
  9.                 dataType: 'json',   //返回值类型  
  10.                success:function(json){        
  11.                     alert(json[0].username+" " json[0].password);    //弹出返回过来的List对象  
  12.                    }  
  13.                 });  
  14.       }  
  15. </script>  
  16.   </head>  
  17.   <body>  
  18.     <input type="button" name="b" value="测试" οnclick=test()>  
  19.   </body>  
<script type="text/javascript" src="js/jquery.js"></script>
 <script type="text/javascript">
     function test(){
    	 $.ajax({ 
    			type:"POST", //请求方式
    			url:"testjson", //请求路径
    			cache: false,   
    			data:"name=zah",  //传参
    			dataType: 'json',   //返回值类型
    	       success:function(json){	    
    			    alert(json[0].username+" " json[0].password);    //弹出返回过来的List对象
    	           }
    			});
      }
</script>
  </head>
  <body>
    <input type="button" name="b" value="测试" οnclick=test()>
  </body>


测试开始,点击按钮弹出zah 123
json[0]就相当于u1对象 json[1]相当于u2对象,对于其属性的访问跟java对象一样,其他的Connection测试应该一样,访问Map的话直接把返回函数改成如下即可:
Java代码 复制代码  收藏代码
  1. success:function(json){       
  2.                alert(json.u1.username)  
  3.                }  
 success:function(json){	    
    			   alert(json.u1.username)
    	           }

    }直接跟上Key.属性即可访问Object对象。
项目源码在下面
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值