Struts2 整合jQuery实现Ajax功能

Easter79
• 阅读 673

Struts2 整合jQuery实现Ajax功能

技术领域很多东西流行,自然有流行的道理,这几天用了jQuery,深感有些人真是聪明绝顶,能将那么多技术融合的如此完美。

首先明确个概念:

jQuery是什么:是使用javascript语言开发的,用于满足项目前台各种操作需要的js程序文件。也就是说,jQuery基本上就是个js程序集,基础核心是jQuery.js文件

l 当然根据不同的版本具体的表现形式:

jQuery.1.6.js或者jquery-1.5.1.js

这个是版本号的不同,具体有哪些区别,还没发现。

l 还有这种形式

jquery-1.5.1.min.js(紧缩格式,取消回车,一行代码)

l 根据应用需求的不同,jQuery

1 引入jQuery

项目中引入jQuery

l 下载jQuery:http://docs.jquery.com/Downloading_jQuery

l 添加核心文件:将核心的jQuery文件复制到项目中。

** **

2 jQuery****的Ajax

jQuery的内容非常庞杂,可以解决诸多方面的需求,主要包括:Ajax,页面效果,页面验证。

作为J2ee项目,我主要关注了一下Ajax和页面验证。

jQuery的Ajax很简单,仅仅使用核心文件jQuery.js就可以实现了。对于这个方面的应用,如下网站的介绍最浅显,最直接:http://www.w3school.com.cn/jquery/ w3c够权威吗?呵呵。

函数

描述

jQuery.ajax()

执行异步 HTTP (Ajax) 请求。

jQuery.get()

使用 HTTP GET 请求从服务器加载数据。

jQuery.getJSON()

使用 HTTP GET 请求从服务器加载 JSON 编码数据。

jQuery.post()

使用 HTTP POST 请求从服务器加载数据。

有关Ajax的方法有很多,这里只简单研究了三种(其实就一种**jQuery.ajax()**),其它的都是jQuery.ajax()的简写形式。

具体格式,上述网站说的已经非常清楚了,记住如下格式就可以。

$.ajax({

type: 'POST', //提交方法

url: url, //提交的地址

data: data, //提交的参数

success: success, //成功后,回调的函数名

dataType: dataType //返回的数据类型

});

示例:

post的示例:使用ajax()的简化格式post()方法:中间有三个参数:url,data(json格式),回调函数(回调函数可以定义在他处,此处仅写函数名)

$.post("test.jsp",

{ name: "John", time: "2pm" },

function(data){

alert("Data Loaded: " + data);

});

3 Struts2****整合jQuery

Struts2中主要的业务操作都是通过Action来完成的,此时就需要jQuery来访问Struts2的Action。

$.post("Action", ……)

3.1 Login.jsp****页面:

l 功能:用户登录,首先需要输入公司标识码:

l 正确:显示对勾;

l 错误:显示红叉;

l jQuery****代码:

l HTML****:当文本框失去焦点时,触发回调事件。

<INPUT id='ckey' name=**"ckey"** onblur="**checkkey();**">

l 说明:

n 当文本框‘ckey’失去焦点时:调用“checkkey”函数;

n “checkkey”函数分别确定两个信息:

u 异步访问:**'getKeyExist'**——判断标识是否正确的Action类。

u 参数:**{companyKey:$('#ckey').attr('value')}**一个以json格式拼写的参数。

u 注:Json的对象格式:

u 发出异步请求:jQuery.post(url, params, callbackFun);

3.2 Action****代码:

传统的Action都是返回String,根据String的不同决定forward到不同的Jsp页面,这给Ajax带来麻烦。我当初还是走了些弯路。

3.2.1 通过Jsp****得到回调信息

就是说:

Login.jsp

jQuery.post( )

Action

message.jsp

l Action:

private String companyKey;

private String remessage;

@Override

public String execute() throws Exception {

String remessage="";

List complist=companydao.findByCompanyKey(companyKey);

if(complist.size()>0)

remessage=" ";

else

remessage=" ";

return SUCCESS;

}

public final void setCompanyKey(String companyKey) {

this.companyKey = companyKey;

}

public final String getRemessage() {

return remessage;

}

l Struts.xml****:

/ajax/message.jsp

l message.jsp:为了保证取得响应信息,jsp文件中只有Jsp****指令

<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>

<%@ taglib prefix="s" uri="/struts-tags" %> <%

String path = request.getContextPath();

String basePath =

request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<s:property value=" **remessage** " />

l 问题:

n 繁琐;

n 上述的方法,在获得响应的信息时,由于是通过一个jsp页面取得,虽然jsp页面中仅有jsp****指令,但是结果仍然会有很多空行,影响取得信息。

3.2.2 Action****自主完成响应:

后来发现,Action也可以自主完成响应,不需要Jsp的支持。代码修改如下:

l Action:新建了个方法getKeyExist,不提供返回值。

if(complist.size()>0)

remessage=" ";

else

remessage=" ";

HttpServletResponse response = ServletActionContext.getResponse();

response.setCharacterEncoding("UTF-8");

response.getWriter().write(remessage);

l *struts.xml:重新建立了无结果result*

l 此时得到的响应就简单干净了很多。

3.2.3 Action响应Json格式信息:

上述方法已经可以得到响应的信息,但是在很多情况下,还需要对响应的结果进行区分,来决定不同的显示效果,此时,响应值就要携带更多的信息,也就是说不是简单的一个字符串,而是一个对象。那么使用Json格式相对来说就比较方便(3.1提到了Json的对象格式)。

l Action:响应信息改为json格式;

if(complist.size()>0){

remessage="{type:'yes',show:'<img src=\"image/ajax/yes.gif\" />'}";

}

else{

remessage="{type:'no',show:'<img src=\"image/ajax/no.gif\" />'}"; }

l jQuery****:回调结果

function callbackFun(data){

eval('json=' + data + ';');

if(json.type=='no'){

$('#ckey').focus();

}

$('#warn').html**(json.show)**;

}

点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Wesley13 Wesley13
3年前
java将前端的json数组字符串转换为列表
记录下在前端通过ajax提交了一个json数组的字符串,在后端如何转换为列表。前端数据转化与请求varcontracts{id:'1',name:'yanggb合同1'},{id:'2',name:'yanggb合同2'},{id:'3',name:'yang
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
待兔 待兔
3个月前
手写Java HashMap源码
HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22
Jacquelyn38 Jacquelyn38
3年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
Wesley13 Wesley13
3年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
Wesley13 Wesley13
3年前
00:Java简单了解
浅谈Java之概述Java是SUN(StanfordUniversityNetwork),斯坦福大学网络公司)1995年推出的一门高级编程语言。Java是一种面向Internet的编程语言。随着Java技术在web方面的不断成熟,已经成为Web应用程序的首选开发语言。Java是简单易学,完全面向对象,安全可靠,与平台无关的编程语言。
Stella981 Stella981
3年前
Django中Admin中的一些参数配置
设置在列表中显示的字段,id为django模型默认的主键list_display('id','name','sex','profession','email','qq','phone','status','create_time')设置在列表可编辑字段list_editable
Wesley13 Wesley13
3年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
Python进阶者 Python进阶者
9个月前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这
Easter79
Easter79
Lv1
今生可爱与温柔,每一样都不能少。
文章
2.8k
粉丝
5
获赞
1.2k