`
xianglg
  • 浏览: 67073 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

struts2+prototype.js实现ajax的无刷新crud操作

    博客分类:
  • ajax
阅读更多
CRUD是Create(创建)、Read(读取)、Update(更新)和Delete(删除)的缩写,除了R,其它每次操作都是对数据库进行了改动,所以,无可避免的要重新对数据库取一遍数据,然后在JSP页面进行显示。如果是无刷新,最笨的方法就是将html代码写到java类里,但如果这样做,你肯定要被扔鸡蛋,下面介绍一种比较容易上手的操作。
首先,我们看一下,仅仅使用struts2,怎么实现CRUD操作。这里,拿删除做例子,其它都雷同。
看一下action类的的内容
public class CRUDAction extends ActionSupport {
	private CRUDEntity crudEntity;//实体Bean

	private List<CRUDEntity> entityList;

	private CRUDService crudService;//实体业务类

	private int cpage = 1;//默认当前页是1

	private static final int pageSize = 10;//每页显示10条

	public void setCrudEntity(CRUDEntity curdEntity){
		this.crudEntity = curdEntity;
	}

	public CRUDEntity getCrudEntity(){
		return this.crudEntity
	}

	public void setCrudService(CRUDService crudService){
		this.crudService = crudService;
	}

	public CURDService getCRUDService(){
		return this.crudService;
	}
	....//其它set,get方法

	/**
	* 分页显示实体信息
	*
	**/
	public 
	public String list(){
		entityList = crudService.pagedQuery(cpage,pageSize);
		return SUCCESS;
	}

	/**
	* 删除实体记录
	*
	**/
	public String delete(){
		if(crudEntity!=null && crudEntity.getId() !=null){//首先判断不为空
			crudService.deleteById(crudEntity.getId());//id是主键
		}
		return SUCCESS;
	}
}

这里service层,使用了spring 的IOC进行了注入。
再看一下,struts.xml配置文件如何写
<action name="list" method="list" class="crudAction">
	<result>/entityManage.jsp</result>
</action>
<action name="delete" method="delete" class="crudAction">
	<result type="redirect-action">list</result>
</action>

配置文件的class也把action类交给了spring管理,但是action类在spring千万不能singleton,否则当多人访问这个action时,你的action就成了有状态的类。举个例子,这里的删除主健id就有可能不是你提交的id。
注意这里的result的type是redirect-action,它表明当删除成功后,直接转向list.action操作,去数据库重新取一遍数据,其实就是response.sendRedirect()。
<%@page language="java" contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<html>
	<head>
		<title>资源来源管理</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
	</head>
<body>
	<table width="100%" cellspacing="0" cellpadding="0" align="center">
		<tr>
			<th>
				序号
			</th>
			<th>
				名称
			</th>
			...
			<th>
				删除
			</th>
		</tr>
		<s:iterator value="entityList" status="stats">
			<tr>
				<td>
					<s:property value="#stats.count"/>
				</td>
				<td>
					<s:property value="name"/>
				</td>
				...
				<td>
					<s:url action="delete" id="delete">
						<s:param name="crudEntity.id" value="%{id}"/>
					</s:url>
					<s:a href="%{deelte}">
						删除
					</s:a>
				</td>
			</tr>
		</s:iterator>
	</table>
</body>
</html>


到这里,应该很清楚整个流程了吧。如果不使用ajax,则每次点击删除时,重新刷一下页面。如果不想让它刷新呢?怎么办?
其实实现也是很简单的,我们对上面的例子做一点小小的感动。
类文件不用改动,XML配置文件只需改动一点

<action name="list" method="list" class="crudAction">
	<result>/entityManage.jsp</result>
</action>
<action name="show" method="list" class="crudAction">
	<result>/entityManage_main.jsp</result>
</action>
<action name="delete" method="delete" class="crudAction">
	<result type="redirect-action">show</result>
</action>


细心的读者可能比较快发现了已经修改了两处,第一:增加了一个action,原来的list是实体管理显示列表的,而在list之后又增加了一个show.action,但其实是用得Action类的一个方法,目的还是在删除后,重新到数据库里取数据。第二,将原来的delete.action的result改为show,有什么用处,往下看。
主要的改动是jsp和js
通过配置文件,可以观察到多了一个jsp文件,这个jsp文件里面是什么,代码奉上:
entityManage.jsp
<%@page language="java" contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<html>
	<head>
		<title>资源来源管理</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<script type="text/javascript"
			src="${pageContext.request.contextPath}/js/prototype.js"></script>
		<script type="text/javascript"
			src="${pageContext.request.contextPath}/js/application.js"></script>
	</head>
<body>
	<div id="div_entityManage_main">
		<s:include value="entityManage_main.jsp"/>
	</div>
</body>
</html>

与原来的jsp文件比,只是少了显示信息的表格,我已经将这部分代码放到了entityManage_main.jsp中,另外,页面引用了prototype.js文件,我们要在后面的application.js写ajax用到。
entityManage_main.jsp:
<%@page language="java" contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<table width="100%" cellspacing="0" cellpadding="0" align="center">
	<tr>
		<th>
			序号
		</th>
		<th>
			名称
		</th>
		...
		<th>
			删除
		</th>
	</tr>
	<s:iterator value="entityList" status="stats">
		<tr>
			<td>
				<s:property value="#stats.count" />
			</td>
			<td>
				<s:property value="name" />
			</td>
			...
			<td>
				<s:a href="javascript:delete(%{id})">
						删除
				</s:a>
			</td>
		</tr>
	</s:iterator>
</table>

代码与原来只是修改了删除的链接,原来是链接action,现在是js。
application.js
 function delete(id) {
 		var url = "delete.action?crudEntity.id="+id;
		new Ajax.Updater (
			'div_entityManage_main',
			url, 
			{
				onLoading:function (){
				},
				onSuccess:function (request) {
					alert('删除成功');
				}, 
				onFailure:function (request) {
					alert("服务器故障,请稍候重试");
				}
			}
		);
 }


所有代码全部写好了,整个流程是这样子的
1.用户使用list.action到管理页面
2.用户点击"删除",触发js的delete方法,delete方法将使用ajax提交delete.action
3.action类删除成功后,将转向show.action去数据库重新提取数据,取到的数据在entityManage_main.jsp显示
4.prototype.js将entityManage_main.jsp的代码又写到enttityManage.jsp的ID为"div_entityManage_main"的DIV中
整个过程,是无刷新的,同样,其它操作同理
9
1
分享到:
评论
4 楼 duronshi 2010-03-26  
如果在js里面读取<s:property value..../>

我现在的解决办法是<input type="text" value="<s:propery....


有没有更好的办法实现,我是用jquery来做的。
3 楼 issaczhang 2009-11-15  
请问,如果是带条件的查询,该如何实现无刷新跳转?譬如说我根据姓名查询,查询出来以后我再删除
2 楼 tanyun1111 2009-07-02  
在有sitemesh的情况下这个能做到吗
1 楼 xxrrss 2008-12-15  
受教了,thank you!

相关推荐

    help\Struts 2 + Spring 2 + JPA + AJAX.

    ### Struts 2 + Spring 2 + JPA + AJAX 技术栈详解 #### 一、技术背景与介绍 在企业级应用开发中,选择合适的技术栈是非常重要的一步。Struts 2 + Spring 2 + JPA + AJAX 这个组合是早期非常流行的一个Java Web...

    Struts2+Hibernate.rar

    Struts2是一个基于MVC(Model-View-Controller)设计模式的Web应用框架,而Hibernate则是一个对象关系映射(ORM)工具,用于简化数据库操作。接下来,我们将深入探讨这两个框架的主要功能、原理及它们在实际开发中的...

    Struts2-Crud+JdbcDemo最简单的Struts2+jdbc学习曾删改查程序

    这个"Struts2-Crud+JdbcDemo"项目是一个基础的学习示例,涵盖了如何使用Struts2和JDBC进行基本的CRUD(创建、读取、更新和删除)操作。 首先,我们来详细了解一下Struts2的核心概念: 1. **Action类**:在Struts2...

    Struts2+Ajax实现的用户登录

    Struts2提供了控制流程,Ajax实现了无刷新的用户交互,Sprint协助管理应用程序组件,而Hibernate则简化了数据库操作。理解并掌握这些技术对于Java Web开发者来说至关重要,因为它们构成了现代企业级应用的基础架构。

    基于Struts 2+Hibernate+Spring实现论坛系统

    这个基于Struts 2+Hibernate+Spring实现的论坛系统,充分利用了这些框架的优势,为用户提供了交互性强、数据管理高效的在线讨论平台。 首先,Struts 2 是一个 MVC(Model-View-Controller)框架,它负责处理用户的...

    网上图书订购系统struts2+hibernate+prototype

    本系统采用的技术栈主要包括Struts2作为MVC框架进行业务控制,Hibernate作为ORM工具处理数据持久化,以及Prototype作为JavaScript库实现Ajax异步交互,从而提升用户体验。接下来,我们将详细探讨这三个技术在系统中...

    struts2+spring3+Hibernate2实现CRUD功能

    1.使用struts2+spring3+hibernate3整合实现用户CRUD功能。 2.使用多种配置方式 A.将hibernate从外部导入,使用MySQL作为数据库。 B.将hibernate实体映射集成到spring配置文件中。 3.使用传统的配置文件集成...

    Struts1.3+Spring4.x+Hibernate4.x框架整合实现对书籍的增删改查(含分页)

    开发者可以定义实体类(Entity)来映射数据库表,然后通过Hibernate的Session接口进行CRUD操作。分页功能通常通过HQL(Hibernate Query Language)或Criteria API来实现,设置适当的限制条件和偏移量,以获取特定...

    Struts2_CRUD.rar_Struts2_CRUD_Struts2的增改删查 操作 示例_struts2_struts2

    在Struts2框架中,CRUD操作通常通过Action类、ActionForm(在较新版本中被POJOs取代)、Result和Interceptor等组件协同工作来实现。以下是对这些概念的详细说明: 1. **Action类**:Action类是业务逻辑的载体,它...

    Struts2+Hibernate实现新闻发布系统

    总结来说,"Struts2+Hibernate实现新闻发布系统"涉及到的主要知识点包括Struts2的MVC架构、Action和拦截器,Hibernate的对象关系映射、CRUD操作,以及自定义的数据库设计。开发者需要理解这两个框架的基本原理和使用...

    最新项目系统:Struts2+Spring4+Hibernate4三大框架整合

    Struts2、Spring4和Hibernate4是Java Web开发中的三大主流框架,它们分别负责MVC模式中的表现层、业务层和服务层。这个最新的项目系统整合了这三个框架,旨在提供一个高效、灵活且易于维护的开发环境。下面将详细...

    ext3+struts2+hibernate+spring的CRUD+分页

    "ext3+struts2+hibernate+spring的CRUD+分页"是一个典型的Java Web开发组合,用于实现全面的数据管理功能。这个组合充分利用了各个框架的优势,提供了一个强大的后端数据处理和前端展示的解决方案。 首先,EXT3是一...

    Struts1+Spring2+Hibernate2整合详细例子

    Hibernate2通过实体类和映射文件将Java对象与数据库表关联,提供了CRUD操作的便捷API。 整合Struts1、Spring2和Hibernate2的过程主要包括以下步骤: 1. **配置环境**:确保所有依赖库已添加到项目的类路径中,如...

    struts2+hibernate+mysql实现注册登录

    在这个项目中,“struts2+hibernate+mysql实现注册登录”是一个基础的实战教程,旨在帮助新手理解如何在实际应用中整合这三个技术。 **Struts2** 是一个强大的MVC框架,它负责处理HTTP请求,控制应用程序的流程,并...

    crud-php-ajax.zip_ajax php_crud php ajax_php ajax

    CRUD(创建、读取、更新、删除)是数据库操作的基本功能,在Web开发中,通常通过前后端交互来实现。本示例中的"crud-php-ajax.zip"是一个包含使用PHP和AJAX实现CRUD操作的项目。这个项目展示了如何在不刷新整个页面...

    struts2 + spring 3 + hibernate3.3整合实现图书馆管理管理

    通过Struts2处理请求和响应,Spring管理对象和事务,Hibernate进行数据库操作,实现了用户管理与书籍管理的核心功能。对于开发者而言,理解并掌握SSH的整合开发,能够提升开发效率,构建出稳定高效的Web应用。

    网上购物struts2+spring+jpa+ajax

    该项目是一个基于Struts2、Spring、JPA和Ajax技术实现的网上购物系统。这个系统的主要目的是为了演示如何在实际开发中整合这些技术,提供一个功能完善的电商应用框架。以下是对这些关键技术点的详细解释: **Struts...

    struts2+jdbc+jsp增删改查

    在本项目"struts2+jdbc+jsp增删改查"中,开发者使用了Struts2来处理用户请求,通过JDBC(Java Database Connectivity)进行数据库操作,而JSP(JavaServer Pages)则作为视图层,显示数据。这个项目的核心在于实现对...

    Struts+Spring+Hibernate+Ajax的Demo

    Struts、Spring、Hibernate和Ajax是Java Web开发中的四大核心技术,它们共同构建了一个高效、灵活的Web应用程序架构。在这个"Struts+Spring+Hibernate+Ajax的Demo"中,开发者使用了这些技术来创建一个功能丰富的示例...

Global site tag (gtag.js) - Google Analytics