11.Ext.Ajax

一、向服务器发送请求。

1.通过Ext.Ajax.request向服务器发送请求。

2.通过url属性来指定发送请求的地址。

3.通过params属性来设置请求参数。

4.callback属性来指定回调函数。

示例一：发送请求。

Ext.Ajax.request({
  url:"loginServer.jsp",
  params:{
     username:"lifengxing",
     password:"123"
  },
  callback:function(options,success,response){
     if(success){
        alert(response.responseText)
     }
  }
})

 

请求页面loginServet.jsp。

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%
  String username = request.getParameter("username");
  String password = request.getParameter("password");
  String msg = "";
  if(username.equals("lifengxing") && password.equals("123")){
     msg = "登陆成功";
  }else{
     msg = "登陆失败";
  }
  response.getWriter().write(msg);
%>

 

示例二：异步提交表单。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
   <title>Request</title>
     <script type="text/javascript" src="../Ext/adapter/ext/ext-base.js"></script>
      <script type="text/javascript" src="../Ext/ext-all-debug.js"></script>
      <link rel="stylesheet" type="text/css" href="../Ext/resources/css/ext-all.css"></link>
      <script type="text/javascript" src="TestRequest2.js"></script>
 </head>
 <body>
   <form id="loginForm">
      用户名:<input type="text" name="username"/><br />
      密码:<input type="password" name="password"/><br />
      <input type="button" value="登陆" onclick="login()" />
   </form>
 </body>
</html>

 

function login() {
  Ext.Ajax.request({
     url:"loginServer.jsp",
     form:"loginForm",
     callback:function(options,success,response){
        if(success){
           alert(response.responseText)
        }
     }
  })

}

 

 

二、向服务器发送XML数据。

function login() {
  Ext.Ajax.request({
     url:"loginServerXML.jsp",
     xmlData:createXML(),
     callback:function(options,success,response){
        if(success){
           alert(response.responseText)
        }
     }
  })
}

function createXML(){
  //获得表单值
  var uname = document.forms["loginForm"].username.value;
  var pw = document.forms["loginForm"].password.value;
  //创建XML文档对象
  var dom = new ActiveXObject("msxml2.DOMDocument");
  //头部声明
  var header = dom.createProcessingInstruction("xml", "version='1.0'");
  dom.appendChild(header);
  var root = dom.createElement("userinfo");
  var username = dom.createElement("username");
  username.text = uname;
  var password = dom.createElement("password");
  password.text = pw;
  root.appendChild(username);
  root.appendChild(password);
  dom.appendChild(root);
  return dom;
}

 

 

服务器解析XML数据。

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ page import="org.dom4j.*"%>
<%@ page import="org.dom4j.io.*"%>
<%
  SAXReader sax = new SAXReader();
  Document document = sax.read(request.getInputStream());
  Element root = document.getRootElement();
  String username = root.element("username").getStringValue();
  String password = root.element("password").getStringValue();
  String msg = "";
  if(username.equals("lifengxing") && password.equals("123")){
     msg = "登陆成功";
  }else{
     msg = "登陆失败";
  }
  response.getWriter().write(msg);
%>

 

 

三、向服务器发送Json数据。

function login() {
  Ext.Ajax.request({
     url:"loginServerJson.jsp",
     jsonData:createJson(),
     callback:function(options,success,response){
        if(success){
           alert(response.responseText)
        }
     }
  })
}

function createJson() {
  var uname = document.forms["loginForm"].username.value;
  var pw = document.forms["loginForm"].password.value;
  var jsonObject = {
     username : uname,
     password : pw
  }
  return jsonObject;
}

 

服务器解析Json数据。

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ page import="net.sf.json.*"%>
<%@page import="java.io.BufferedReader;"%>
<%
  BufferedReader in = request.getReader();
  StringBuffer jsonStr = new StringBuffer();
  String str = "";
  while((str = in.readLine()) != null) {
     jsonStr.append(str);
  }
  JSONObject jsonObject = JSONObject.fromObject(jsonStr.toString());
  String username = jsonObject.getString("username");
  String password = jsonObject.getString("password");
  String msg = "";
  if(username.equals("lifengxing") && password.equals("123")){
     msg = "登陆成功";
  }else{
     msg = "登陆失败";
  }
  response.getWriter().write(msg);

%>

 

posted @ 2015-08-09 16:45  W&L  阅读(136)  评论(0)  编辑  收藏  举报