Javascript实现ajax提交form表单到xml文件（Javaweb）

最新推荐文章于 2023-11-14 15:19:40 发布

Mr_Darry

最新推荐文章于 2023-11-14 15:19:40 发布

阅读量957

点赞数

分类专栏： JavaWEB ajax 文章标签： ajax ajax提交表单 java web

本文链接：https://blog.csdn.net/Mr_Dave/article/details/54575178

版权

JavaWEB 同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

ajax

1 篇文章 0 订阅

订阅专栏

（1）ajax实现异步数据传输的原理：
当我们使用ajax技术通过页面与服务器交换数据的时候，web ui实际上是将请求交给了ajax引擎去处理。这样就使得ajax引擎充当了中转站的角色。只要ajax接受了web ui提交过来的请求，那么与后台交互的责任就落在了ajax引擎的身上。由于将交互工作交给了ajax引擎，使得web ui可以不必再等待服务器端产生回应后再进行其他操作，所以用户不必再等待而可以进行其他操作。

（2）ajax实现页面无刷新数据更新的原理：
当服务器将提交的请求处理完毕后返回结果也将返回给ajax引擎（注意，返回给ajax引擎的结果为文本形式，要么是xml文件，要么是纯文本），然后通过使用javascript从ajax引擎中取出数据，并操作DOM对象进行页面数据的更新。由于并不是从服务器端重新发回页面，而是通过javascript取出浏览器内置的ajax引擎中的数据来渲染页面，所以页面将不刷新而进行数据的更新。

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">

    <title>My JSP 'ObtainXml.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">
    <script>
       var validate=function(){
         var xmlHttp;
         var divname=document.getElementById("username");
         if(window.XMLHttpRequest){
           xmlHttp=new XMLHttpRequest();
         }else{
           xmlHttp=new ActiveObject("Microsoft.XMLHTTP");
         }
         var url="/servlet/AjaxParseXML?username='+username+'&pwd='+pwd";
         //username='+username+'&password='+password"
         xmlHttp.open("POST",url,true);
         xmlHttp.send(null);
         xmlHttp.onreadystatechange=function(){
         if(xmlHttp.readystate==4&&xmlHttp.status==200){
            Log.console("成功");
            }
         }
       }
    </script>
  </head>

  <body>
  <form action="${pageContext.request.contextPath}/servlet/AjaxParseXML">
  <div>
      用户名：<input type="text" id="username" name="username"/></br>
      密  码：<input type="password" name="pwd"/>
            <input type="submit" value="提交" onClick="validate()"/>
    </div>
    </form>
    <div id="name">

    </div>
  </body>
</html>

package servlet;

import java.io.IOException;

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

import utils.Dom4jParseXml;

public class AjaxParseXML extends HttpServlet {

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
       response.setContentType("text/html;charset=utf-8");
       String username=new String(request.getParameter("username").getBytes("iso-8859-1"),"utf-8");
       String pwd=new String(request.getParameter("pwd").getBytes("iso-8859-1"),"utf-8");
       //String user1="wang";
       try {
            Dom4jParseXml.UpdateUserXML(username,pwd);
        } catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
     doGet(request,response);
    }

}

package utils;

import java.io.FileOutputStream;
import org.dom4j.Document;
import org.dom4j.Element;
import org.dom4j.io.OutputFormat;
import org.dom4j.io.SAXReader;
import org.dom4j.io.XMLWriter;

public class Dom4jParseXml { 
    /**
     * DOM4j解析xml文件。
     * @param volt
     * 设置测试电压范围
     */
    public static void UpdateUserXML(String username,String pwd) throws Exception{
        //获取解析器
        SAXReader reader=new SAXReader();
        //读取xml文件../webapps/TS7000test/TestParam.xml
        Document dom=reader.read("../webapps/Ajax/users.xml");//服务器文件相对路径
        //获取xml文件内元素节点；
        Element root=dom.getRootElement();
        root.element("username").setText(username);
        root.element("pwd").setText(pwd);
        XMLWriter writer=new XMLWriter(new FileOutputStream("../webapps/Ajax/users.xml"),OutputFormat.createPrettyPrint());
        writer.write(dom);
        writer.close();
    }
}

<?xml version="1.0" encoding="UTF-8"?>

<user> 
  <username>lilei</username>  
  <pwd>123</pwd> 
</user>

Mr_Darry

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Javascript实现ajax提交form表单到xml文件（Javaweb）

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServer
复制链接

扫一扫