ExtJS与服务器交互

最新推荐文章于 2024-08-29 17:19:59 发布

whatsyourname

最新推荐文章于 2024-08-29 17:19:59 发布

阅读量100

点赞数

分类专栏： extjs 文章标签： xhtml json java

本文链接：https://blog.csdn.net/whatsyourname/article/details/84229718

版权

extjs 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

一、向服务器发送请求。

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

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

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

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

示例一：发送请求。

Ext.Ajax.request({

url:"loginServer.jsp",

params:{

username:"lifengxing",

password:"123"

callback:function(options,success,response){

if(success){

alert(response.responseText)

}

})

请求页面loginServer.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("lifengxing".equals(username)&&"123".equals(password)){

msg = "登陆成功";

}else{

msg = "登陆失败";

}

response.getWriter().write(msg);

示例二：异步提交表单。

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

<title>TestDomhelper</title>

</head>

<body>

用户名：<input type="text" name="username"/><br />

密码：<input type="password" name="password"/><br />

</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);//给dom加入头部声明

var root = dom.createElement("userinfo");

var username = dom.createElement("username");//createElement创建节点

username.text = uname;

var password = dom.createElement("password");

password.text = pw;

root.appentChild(username);

root.appentChild(password);

dom.appendChild(root);

return dom;

}

服务器解析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);//给dom加入头部声明

var root = dom.createElement("userinfo");

var username = dom.createElement("username");//createElement创建节点

username.text = uname;

var password = dom.createElement("password");

password.text = pw;

root.appendChild(username);

root.appendChild(password);

dom.appendChild(root);

return dom;

}

<%@ 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("lifengxing".equals(username)&&"123".equals(password)){

msg = "登陆成功";

}else{

msg = "登陆失败";

}

response.getWriter().write(msg);

注意：需要导入dom4j这个JAR包

三、向服务器发送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("lifengxing".equals(username)&&"123".equals(password)){

msg = "登陆成功";

}else{

msg = "登陆失败";

}

response.getWriter().write(msg);

注意：需要导入如下几个JAR包。

commons-beanutils.jar

commons-lang.jar

ezmorph-1.0.6.jar

commons-logging-1.1.jar

commons-collections-3.1.jar

json-lib-2.2.3-jdk15.jar

whatsyourname

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ExtJS与服务器交互

一、向服务器发送请求。1.通过Ext.Ajax.request向服务器发送请求。2.通过url属性来指定发送请求的地址。3.通过parans属性来设置请求参数。4.callback属性来指定回调函数。示例一：发送请求。Ext.Ajax.request({ url:"loginServer.jsp", params:{ username:"lifeng...
复制链接

扫一扫

专栏目录