ajax 与jsp servlet
由于项目需要通过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
其中一般项目中都会有前4个，所以只需要下载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类：
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
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 );//转化成json对象
JSONObject jo=JSONObject.fromObject(m);//转化Map对象
out.print(jsonArray2);//返给ajax请求
out.print(jo);//返给ajax请求
}
}
配置好web.xml中的servlet映射，这一步就略了。
3.建立ajax实现
这里为了快速实现用的是jquery实现的。
<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="测试" onclick=test()>
</body>
测试开始，点击按钮弹出zah 123
json[0]就相当于u1对象 json[1]相当于u2对象，对于其属性的访问跟java对象一样，其他的Connection测试应该一样,
访问Map的话直接把返回函数改成如下即可：
success:function(json){
alert(json.u1.username)
}
}直接跟上Key.属性即可访问Object对象。
文章出处：飞诺网(www.firnow.com):http://dev.firnow.com/course/4_webprogram/ajax/ajaxxl/20100721/476877.html
CheckServlet.java源代码如下：
package ajax.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
*
* @author Thinkpad
*
*/
public class CheckServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
response.setCharacterEncoding("UTF-8");
PrintWriter out = response.getWriter();
String name = request.getParameter("username");
out.print("我是服务器，收到客户端的数据:"+name);
out.flush();
out.close();
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doGet(request, response);
}
}
3、编写客户端html文件
新建ajax.html文件
ajax.html文件源码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ajax实现校验</title>
<mce:script type="text/javascript" src="jslib/jquery.js" mce_src="jslib/jquery.js"></mce:script>
<mce:script type="text/javascript" src="jslib/verify.js" mce_src="jslib/verify.js"></mce:script>
</head>
<body>
<input type="text" id="username">
<input type="button" value="校验" onclick="verify()" >
<dir id="result"></dir>
</body>
</html>
4、下载jquery.js文件
下载地址：http://docs.jquery.com/Downloading_jQuery
下载后，将文件拷贝到文件结构中
5、编写verify.js文件
verify.js源代码如下：
function verify() {
// 注解
// alert("点击了按钮");
// jquery查询节点的方法
var jqueryObj = $("#username");
// 获取文本框中用户输入的数据
var username = jqueryObj.val();
// alert(username);
// 将数据发送给服务器的servlet
$.get("servlet/CheckServlet?username=" + username, null, callback);
}
// 回调函数
function callback(data) {
// alert("收到服务器返回的数据");
// alert(data);
var resultObj = $("#result");
resultObj.html(data);
}
ajax 与jsp servlet的更多相关文章
- Ajax+Jsp+servlet+json技术的使用
Ajax+Jsp+servlet+json技术的使用 在使用json的时候,记得必须导入如下几个.jar包,最好是手动复制.jar包只lib路径下,否则可能出现异常. commons-beanutil ...
- jQuery Ajax传值给Servlet,在Servlet里Get接受参数乱码的解决方法
最近在学jquery ui,在做一个小功能的时候需要将前台的值获取到,通过Ajax传递给Servlet,然后再在返回数据结果,但是在Servlet接受参数的时候,通过后台打印,发现接受乱码,代码示例如 ...
- 纯Html+Ajax和JSP两者对比的个人理解
最近写个人web,用jsp+servlet做,突然想到一个问题:html+ajax似乎和jsp实现效果一样:那么,两者到底有什么区别呢? 这里参考老猿的一段话: 全站ajax会维护大量的js代码,如何 ...
- 软件架构设计学习总结（18）：MVC三层架构在各框架（jsp+servlet + Struts1+ Struts2+ springMVC）中的特征
1.基于web开发中最原始的jsp+Servlet 图形化理解jsp+servlet结构: 1.从结构上分析jsp+servlet图解原理: 在基于mvc设计模式下的最原始的jsp+Servlet ...
- 使用JSP+Servlet+Jdbc+Echatrs实现对豆瓣电影Top250的展示
使用JSP+Servlet+Jdbc+Echatrs实现对豆瓣电影Top250的展示 写在前面: 有的小伙伴,会吐槽啦,你这个标题有点长的啊.哈哈 ,好像是的!不过,这个也是本次案例中使用到的关键技术 ...
- JSP+Servlet 实现：理财产品信息管理系统
一.接业务,作分析 1.大致业务要求 1.1 使用 JSP+Servlet 实现理财产品信息管理系统,MySQL5.5 作为后台数据库,实现查看理财 和增加理财功能 1.2 查询页面效果图 1.3 添 ...
- jsp+servlet和ajex中遇到的问题
软件杯的时候,我们的项目需要在手机端运行,由于本身的这个项目我们使用jsp+servlet做的一个项目,所以我们利用ajex,把eclipse作为后台运行tomcat8,,在hbuilder用weba ...
- javaweb练手项目jsp+servlet简易购物车系统
简易购物车项目 这是一个用intellij IDEA做的简易的javaweb项目,开发环境使用的jdk1.8和tomcat8以及mysql数据库. 1.项目开发准备: 创建github仓库 项目框架搭 ...
- jsp+servlet上传excel并将数据导入到数据库表的实现方法
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
随机推荐
- js基本知识
1.js中的数据类型: js中的数据类型有undefined,boolean,number,string,object等5种,前4种为原始类型,第5种为引用类型. 2.typeof 返回的是字符串,有 ...
- 必做作业3：短视频编辑app原型化系统
本app立足于打造短视频分享交流社区,app不仅有视频编辑的功能,还有视频的分享和收藏功能.系统有登录.注册.找回密码的功能,可以进行账号资料管理,并可以管理自己的视频.分享和收藏.系统可以对视频进行 ...
- Java的注解总结
java 1.5开始引入了注解和反射,正确的来说注解是反射的一部分,没有反射,注解无法正常使用,但离开注解,反射依旧可以使用.Java的注解详解和自定义注解: https://blog.csdn.ne ...
- DataGridView添加的数据最后一步无法生效的问题。
在做项目时,需要使用到大量固定的参数,使用时只需修改一部分定值即可,所以就选用DataGridView控件进行循环添加,数据添加完成,一切正常,但是在修改数据时发现,每一次修改的数据的操作的最后一步总 ...
- k3生成解决方案时错误处理
F6一键生成,会出现进程使用的错误,关掉了游览器,bos设计器,以及重启了本机iis站点,都没解决,打开任务管理器发现,bos.ide没有关掉
- Java运行时数据区
目录 1. 概述 2. Java内存结构 3. 程序计数器 4. Java虚拟机栈 5. 本地方法栈 6. 堆 7. 方法区 8. 运行时常量池 9. 直接内存 10. 总结 1. 概述 作为日常的J ...
- python基础系列教程，数学基础系列教程，数据分析系列教程，神经网络系列教程，深度学习系列视频教程分享交流
大家好,我是一个技术爱好者,目前对大数据人工智能很是痴迷,虽然学历只有高中,目前正在大踏步的向着人工智能狂奔,如果你也想学习,那就来吧 我的学习进度python基础(Numpy,pandas,matp ...
- Ubuntu上部署tomcat后无法访问8080端口问题
在tomacat的bin目录下,修改startup.sh文件,添加信息: #set java environment export JAVA_HOME=/usr/java/jdk1.8.0_111 e ...
- 关于新版oracle不支持wm_concat函数的解决办法
oracle12G中不支持wm_concat,就改用:listagg(合并字段,'连接符号') within group (order by 字段) 来实现列转行
- mysql，查询时间戳
1.查询当前时间1天前的时间点 select date_sub(now() ,interval 1 day) 2.查询当前时间的时间1天之后的时间点 select data_sub(now ...