Ajax实现xml文件数据插入数据库（二）--- ajax实现与jsp的数据交互

来源：互联网发布：java软件工程培训编辑：程序博客网时间：2024/05/16 07:51

前文中我们介绍了用JavaScript解析xml文件的方法，本文承接上文中解析好的xml文件中的数据，现在需要将这些数据传递到后台。在这里我们首先用js将解析好的数据拼接成字符串，然后到jsp中再根据解析规则对传过来的数据进行拆解后重新组装，得到我们想要的格式。下面的代码首先通过Ajax将解析好的xml数据传递到jsp:

[javascript] view plain copy
<span style="font-size:12px;">  <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);              
        }</span>  

上述函数之间的调用过程是客户端通过点击按钮触发js中的insertAllData()函数，该函数在执行过程中首先调用原先构建的js库中的方法对xml文件进行解析，并将解析好的数据拼接成字符串，之后调用ajaxRequest()方法将拼接好的字符串以post方式传递给index.jsp。jsp取得传过来的字符串后将其重新按规则构建成我们想要的额数据的过程是这样的（jsp中代码）：

[plain] view plain copy
<span style="font-family:SimSun;font-size:12px;"><%@ 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></span>  

上面的代码中我们将从客户端接收到的数据进行了拆分并根据一定的规则重新组织成新的结构，并调用了javaBean中的相关方法实现了数据的插入。在接下来的文章中我们将对本过程的最后一个环节（即调用javaBean相关方法进行插入）进行介绍。

0 0