六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 19|回复: 0

用ajax来读xml(servlet生成的)用到JQuery技术

[复制链接]

升级  34%

27

主题

27

主题

27

主题

秀才

Rank: 2

积分
101
 楼主| 发表于 2013-1-29 10:34:47 | 显示全部楼层 |阅读模式
准备:
下载Jquery.js文件、dom4j.jar包
新建一个html页面:
导入JQuery文件:
<script type="text/javascript" src="jquery-1.7.1.js"></script>
在body里写入:
<select id="name">  <option value="zhangsan">zhangsan</option>  <option value="lisi">lisi</option>  </select><input type="button" id="button1" value="点击看一看">
在head里用JQuery来写ajax代码(比用Javascript写简单些)
<script type="text/javascript">$(function(){$("#button1").click(function(){$.post("../xmlservlet",{name:$("#name").val()},function(returnedData,status){var id=$(returnedData).find("id").text();var name=$(returnedData).find("name").text();var age=$(returnedData).find("age").text();var address=$(returnedData).find("address").text();var html="<table width='60%' border='1' align='center'>"+"<tr><th>id</th><th>name</th><th>age</th><th>address</th></tr>"+"<tr align='center'><td>"+id+"</td><td>"+name+"</td><td>"+age+"</td><td>"+address+"</td></tr>"+"</table>";$("body table:eq(0)").remove();$("body").append(html);})});});</script>
现在界面搞定了开始servlet层:
新建个Javabean名字叫Student:
package com.niit.model;public class Student{private int id;private String name;private int age;private String address;public int getId(){return id;}public void setId(int id){this.id = id;}public String getName(){return name;}public void setName(String name){this.name = name;}public int getAge(){return age;}public void setAge(int age){this.age = age;}public String getAddress(){return address;}public void setAddress(String address){this.address = address;}}
在新建个servlet来处理
package com.niit.test;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;import org.dom4j.Document;import org.dom4j.DocumentHelper;import org.dom4j.Element;import org.dom4j.io.OutputFormat;import org.dom4j.io.XMLWriter;import com.niit.model.Student;public class Xmlservlet 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{String name = request.getParameter("name");// TODO 调用service得到Student对象。这里是MOCKStudent student = new Student();if ("zhangsan".equals(name)){student.setId(1001);student.setName(name);student.setAge(28);student.setAddress("上海");}else if ("lisi".equals(name)){student.setId(3321);student.setName(name);student.setAge(39);student.setAddress("南京");}// 下面构建XML// 方法1:直接字符串连接,js可以解析该内容// 方法2:可以使用dom4j等API生成XML。dom4j需要下载jar包,是比较常用的xml开源APIDocument document = DocumentHelper.createDocument();// 构建Document对象Element rootelement = document.addElement("students");// 创建根元素rootelement.addComment("This is a comment!");// 添加注释Element studentelement = rootelement.addElement("student");Element idelement = studentelement.addElement("id");Element namelement = studentelement.addElement("name");Element agelement = studentelement.addElement("age");Element addresselement = studentelement.addElement("address");idelement.setText("" + student.getId());namelement.setText(student.getName());agelement.setText("" + student.getAge());addresselement.setText(student.getAddress());response.setContentType("text/xml;charset=utf-8");response.setHeader("pragma", "no-cache");response.setHeader("cache-control", "no-cache");PrintWriter out = response.getWriter();OutputFormat format=OutputFormat.createPrettyPrint();//用来设置文本格式的。可读性较好的XMLWriter xmlwriter=new XMLWriter(out,format);xmlwriter.write(document);out.flush();out.close();}}
注意一点那个Document对象是org.dom4j包下的。
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表