Ajax实现xml文件数据插入数据库(二)--- ajax实现与jsp的数据交互
2013-07-04 20:24
686 查看
前文中我们介绍了用javascript解析xml文件的方法,本文承接上文中解析好的xml文件中的数据,现在需要将这些数据传递到后台。在这里我们首先用js将解析好的数据拼接成字符串,然后到jsp中再根据解析规则对传过来的数据进行拆解后重新组装,得到我们想要的格式。下面的代码首先通过Ajax将解析好的xml数据传递到jsp:
上述函数之间的调用过程是客户端通过点击按钮触发js中的insertAllData()函数,该函数在执行过程中首先调用原先构建的js库中的方法对xml文件进行解析,并将解析好的数据拼接成字符串,之后调用ajaxRequest()方法将拼接好的字符串以post方式传递给index.jsp。jsp取得传过来的字符串后将其重新按规则构建成我们想要的额数据的过程是这样的(jsp中代码):
上面的代码中我们将从客户端接收到的数据进行了拆分并根据一定的规则重新组织成新的结构,并调用了javaBean中的相关方法实现了数据的插入。在接下来的文章中我们将对本过程的最后一个环节(即调用javaBean相关方法进行插入)进行介绍。
<script language="javascript"> var xmlHttp=null; function readyStateChangeHandle() { if(xmlHttp.readyState==4) { if(xmlHttp.status==200) { alert("请求成功"); }else{ alert("请求失败"); } } } function ajaxRequest(transData) { if(window.XMLHttpRequest) { xmlHttp=new XMLHttpRequest(); }else if(window.ActiveXObject){ xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlHttp.onreadystatechange=readyStateChangeHandle; xmlHttp.open("POST","index.jsp?transData=" + transData,true); xmlHttp.send(null); } function insertAllData(){ var stringData=""; var dataCollection = readAllChildNode('authority.xml','userId'); for(var i=0;i<dataCollection.length;i++){ stringData = stringData+dataCollection[i] + ","; } ajaxRequest(stringData); }
上述函数之间的调用过程是客户端通过点击按钮触发js中的insertAllData()函数,该函数在执行过程中首先调用原先构建的js库中的方法对xml文件进行解析,并将解析好的数据拼接成字符串,之后调用ajaxRequest()方法将拼接好的字符串以post方式传递给index.jsp。jsp取得传过来的字符串后将其重新按规则构建成我们想要的额数据的过程是这样的(jsp中代码):
<%@ page language="java" import="java.util.*" contentType="text/html; charset=GB18030" pageEncoding="GB18030"%> <%@ page import="UserManager.*" %> <% //设置字符集 request.setCharacterEncoding("GB18030"); String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; //取得客户端传来的拼接好的字符串 String receiveStr = request.getParameter("transData"); //去掉字符串最后的逗号 receiveStr = receiveStr.substring(0, receiveStr.length() - 1); //将字符串以逗号为界拆分成数组 String[] m =receiveStr.split(","); //实例化一个javaBean对象 UserManager userManager = new UserManager(); int x=0; for(int a = 0; a < m.length / 3;a++){ ArrayList<String> n1 = new ArrayList<String>(); //该循环的作用是将字符串数组中的数据每三个装入一个ArrayList中 for(int i =3*x ;i<3*x+3;i++){ n1.add(m[i]); } x++; //将填装了数据的ArrayList重新转换为字符串数组 String[] values = (String[])n1.toArray(new String[0]); //调用javabean相关方法实现数据插入数据库 userManager.insertUser(values[0], values[1], values[2]); } %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> This is my JSP page. <br> </body> </html>
上面的代码中我们将从客户端接收到的数据进行了拆分并根据一定的规则重新组织成新的结构,并调用了javaBean中的相关方法实现了数据的插入。在接下来的文章中我们将对本过程的最后一个环节(即调用javaBean相关方法进行插入)进行介绍。
Ajax实现xml文件数据插入数据库(一)--- 构建解析xml文件的js库。
Ajax实现xml文件数据插入数据库(三)---javabean实现数据库插入。
相关文章推荐
- Ajax实现xml文件数据插入数据库(二)--- ajax实现与jsp的数据交互。
- Ajax实现xml文件数据插入数据库(三)---javabean实现数据库插入
- Ajax实现xml文件数据插入数据库(一)--- 构建解析xml文件的js库
- Ajax实现xml文件数据插入数据库(一)--- 构建解析xml文件的js库
- Ajax实现xml文件数据插入数据库(三)---javabean实现数据库插入
- Ajax实现xml文件数据插入数据库(一)--- 构建解析xml文件的js库
- java实现读取XML文件数据插入到数据库中
- 用Ajax实现多级联动下拉列表For JSP(无限级别,JSON传输数据,含全国地区数据库
- Java实现把excel xls中数据转为可直接插入数据库的sql文件
- 将XML文件数据插入到数据库中
- Jsp页面中ajax提交数据:及hbm.xml文件中出现的错误
- 数据库操作_连接SQL Server数据库示例;连接ACCESS数据库;连接到 Oracle 数据库示例;SqlCommand 执行SQL命令示例;SqlDataReader 读取数据示例;使用DataAdapter填充数据到DataSet;使用DataTable存储数据库表;将数据库数据填充到 XML 文件;10 使用带输入参数的存储过程;11 使用带输入、输出参数的存储过程示;12 获得数据库中表的数目和名称;13 保存图片到SQL Server数据库示例;14 获得插入记录标识号;Exce
- jQuery的ajax()检验用户名;通过jQuery的load()/get()/post()方法实现;使用XMLHTTPRequest对象来进行AJAX的异步数据交互
- ajax方式实现注册功能(提交数据到后台数据库完成交互)
- 用jsp将xml文件解析到网页显示,并把数据提交保存到数据库
- Hibernate之*hbm.xml文件和实体类操作数据库实现插入和查询
- hibernate之利用配置文件和annotation往数据库里插入数据
- JSP get 请求 Tomcat 服务器 插入数据到数据库中文乱码处理
- jquery+ajax+C#实现无刷新操作数据库数据的简单实例
- 玩转Web之Json(二)----jquery easy ui + Ajax +Json+SQL实现前后台数据交互