`
dreamoftch
  • 浏览: 485718 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

总结一下这次用ajax/json实现SSH

阅读更多

首先最简单的来说:

引入struts2-json-plugin jar包

	<package name="myjson" extends="json-default">
		<action name="getJson" class="userAction" method="getJson">
			<result type="json">
				<param name="root">jsonResult</param>
			</result>
		</action>
	</package>

action 中的方法:

	public String getJson(){
		jsonResult = new HashMap<String, Object>();
		User user = new User(); 
		user.setName("username");
		user.setId(110);
		user.setPassword("password");
		jsonResult.put("user", user);
		return SUCCESS;
	}

 页面:

<script type="text/javascript">
		function getJson(){
			$.getJSON("getJson.action", function(json){
			  alert(json.user);
			});
		}
	</script>

  

 

实现的大概功能很简单:输入关键字查询,结果关键字红色显示,批量删除,分页,等等,前台通过ajax获取json数据,然后显示。可以每页显示25,50,75条数据,可以直接跳转到指定页。。。

 

页面通过jquery的 post方法,设置返回值类型为json,struts2里面,在struts.xml中引入json-default,即可引入result的type为json的类型,这样返回给前台的数据就是json格式,里面封装了action里面可以通过get方法获取到的属性,如果不希望某属性被添加到json里面,可以通过@JSON(serialize=false)在它的get方法上注解一下就好了。。。

 

首先是 web.xml:

 

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" 
	xmlns="http://java.sun.com/xml/ns/j2ee" 
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
	xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee 
	http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>

	 <listener>
        <listener-class>
			org.springframework.web.context.ContextLoaderListener
		</listener-class>
     </listener>
     
	<filter>
		<filter-name>struts2Filter</filter-name>
		<filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
	</filter>
	<filter-mapping>
		<filter-name>struts2Filter</filter-name>
		<url-pattern>/*</url-pattern>
		<dispatcher>REQUEST</dispatcher>
		<dispatcher>FORWARD</dispatcher>
	</filter-mapping>
	
</web-app>

 web.xml里面没有什么东东,只有一个启动spring的监听器和struts2的filter

 

 

接下来是applicationcontext.xml:

 

 

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
	xmlns:jee="http://www.springframework.org/schema/jee" 
	xmlns:aop="http://www.springframework.org/schema/aop"
	xmlns:tx="http://www.springframework.org/schema/tx" 
	xmlns:context="http://www.springframework.org/schema/context"
	xmlns:task="http://www.springframework.org/schema/task"
	xsi:schemaLocation="http://www.springframework.org/schema/beans
	http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
	http://www.springframework.org/schema/tx
	http://www.springframework.org/schema/tx/spring-tx-3.0.xsd
	http://www.springframework.org/schema/jee
	http://www.springframework.org/schema/jee/spring-jee-3.0.xsd
	http://www.springframework.org/schema/context
	http://www.springframework.org/schema/context/spring-context-3.0.xsd
	http://www.springframework.org/schema/aop
	http://www.springframework.org/schema/aop/spring-aop-3.0.xsd
	http://www.springframework.org/schema/task
	http://www.springframework.org/schema/task/spring-task-3.0.xsd"
	default-lazy-init="false">
	<!-- 这里是把action交给spring来管理 -->
	<bean id="myAction" class="action.MyAction"></bean>
	 
	<bean id="dataSource"  
        class="org.apache.commons.dbcp.BasicDataSource">
		<property name="driverClassName" value="com.mysql.jdbc.Driver" />
		<property name="url" value="jdbc:mysql://localhost:3306/testdb" />
		<property name="username" value="root" />
		<property name="password" value="root" />
	</bean>

	<bean id="sessionFactory"  
        class="org.springframework.orm.hibernate3.LocalSessionFactoryBean">  
		<property name="dataSource">
			<ref bean="dataSource" />
		</property>
		<property name="mappingDirectoryLocations">
			<list>
				<value>classpath:mapping</value>
			</list>
		</property>  
		<property name="hibernateProperties">  
            <props>
            	<prop key="hibernate.dialect">org.hibernate.dialect.MySQLDialect</prop>
            	 <prop key="hbm2ddl.auto">update</prop> 
            	<prop key="hibernate.show_sql">true</prop>
            </props>
        </property>  
	</bean>

	<bean id="transactionManager"
		class="org.springframework.orm.hibernate3.HibernateTransactionManager">
		<property name="sessionFactory" ref="sessionFactory" />
	</bean>
	  
	<bean id="userDao" class="dao.UserDao">
		<property name="sessionFactory" ref="sessionFactory"></property>
	</bean>
	
	<bean id="userService" class="service.UserService">
		<property name="userDao" ref="userDao"></property>
	</bean>
	
	<tx:advice id="TestAdvice" transaction-manager="transactionManager">
    <tx:attributes>
      <tx:method name="save*" propagation="REQUIRED"/>
      <tx:method name="del*" propagation="REQUIRED"/>
      <tx:method name="update*" propagation="REQUIRED"/>
      <tx:method name="add*" propagation="REQUIRED"/>
      <tx:method name="find*" propagation="REQUIRED" read-only="true"/>
      <tx:method name="get*" propagation="REQUIRED" read-only="true"/>
      <tx:method name="apply*" propagation="REQUIRED"/>
    </tx:attributes>
	</tx:advice>
 
	<aop:config>
		<aop:pointcut id="allTestServiceMethod" expression="execution(* service.*.*(..))"/>
		<aop:advisor pointcut-ref="allTestServiceMethod" advice-ref="TestAdvice" />
	</aop:config>
</beans>

 

 

都是很简单的东东,自己做测试的东东嘛。。。就图个简单

 

下面是struts.xml

 

 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN"
        "http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
	<!-- 开发阶段设置 -->
	<constant name="struts.devMode" value="true" />
	<constant name="struts.serve.static.browserCache " value="false" />
	<constant name="struts.configuration.xml.reload" value="true" />

	<package name="" extends="json-default">
		<action name="testAction" class="action.MyAction" method="method1">
			<result>/page/MyJsp.jsp</result>
		</action>
		<action name="getJson" class="action.MyAction" method="getJson">
			<result type="json"></result>
		</action>
		<action name="deleteRecord" class="action.MyAction" method="deleteRecord">
			<result type="chain">getJson</result>
		</action>
	
	</package>
</struts>

 这里面注意是

 

<package name="" extends="json-default">   <!-- 这里继承的json-default包 -->

 

<action name="getJson" class="action.MyAction" method="getJson">
	<result type="json"></result>   <!-- 这里是json的结果类型 -->
</action>

所以需要额外引入   struts2-json-plugin-2.3.12.jar  这个jar包。。。

 

下面是我的action类:

 

package action;

import java.util.List;

import org.apache.struts2.json.annotations.JSON;

import service.UserService;

import com.opensymphony.xwork2.ActionSupport;

import condition.QueryCondition;

import entity.User;

public class MyAction extends ActionSupport{
	private static final long serialVersionUID = 1L;
	private List<User> users;
	private UserService userService;    //进行调用的service类,它再调用Dao操作数据库,这里就不上代码了
	private QueryCondition queryCondition;
	private int time;
	private String flag;
	
	public String getJson(){
		return method1();
	}
	
	public String method1(){
		/**
		 * 初始化查询参数
		 */
		if(null == queryCondition){
			queryCondition = new QueryCondition();
		}
		queryCondition.setPageNum(queryCondition.getPageNum() > 0 ? queryCondition.getPageNum() : 1);
		if(null != queryCondition.getName()){
			queryCondition.setName(queryCondition.getName().trim());
		}
		getTotal();   //查询总页数
		//如果要查询的页数大于总页数,则将查询页数改为总页数
		if(queryCondition.getPageNum()>queryCondition.getTotalNum()){
			queryCondition.setPageNum(queryCondition.getTotalNum());
		}
		users = userService.getUsersByUsernameOrRealname(queryCondition.getName(),queryCondition.getPageNum(),queryCondition.getSize(),
				queryCondition.getOrderBy());
		return "success";
	}
	
	public String deleteRecord(){
		userService.deleteRecord(queryCondition.getUserIDs());
		return "success";
	}
	
	public int getTotal(){
		if(null != queryCondition.getName()){
			queryCondition.setName(queryCondition.getName().trim());
		}
		int result = userService.getTotalNum(queryCondition.getName());
		int size = queryCondition.getSize() !=0 ? queryCondition.getSize() :25;
		if(result%size == 0){
			queryCondition.setTotalNum(result/size);
		}else{
			queryCondition.setTotalNum(result/size+1);
		}
		return queryCondition.getTotalNum();
	}
	
	@JSON(serialize=false) //表明这个属性不需要被序列化为json的属性,下同
	public String getFlag() {
		return flag;
	}

	public void setFlag(String flag) {
		this.flag = flag;
	}
	@JSON(serialize=false)
	public int getTime() {
		return time;
	}

	public void setTime(int time) {
		this.time = time;
	}
	@JSON(serialize=false)
	public UserService getUserService() {
		return userService;
	}

	public QueryCondition getQueryCondition() {
		return queryCondition;
	}

	public void setQueryCondition(QueryCondition queryCondition) {
		this.queryCondition = queryCondition;
	}
	
	public void setUserService(UserService userService) {
		this.userService = userService;
	}

	public List<User> getUsers() {
		return users;
	}

	public void setUsers(List<User> users) {
		this.users = users;
	}
}

 

action里面用到的DTO:QueryCondition.java

 

package condition;

/**
 * 
 * Created on Mar 11, 2013
 * <p>Title:       
 * <p>Description: [查询条件的javabean]</p>
 * <p>Copyright:   Copyright (c) 2012</p>
 * <p>Company:     </p>
 * <p>Department:  
 * @author        
 * @version        1.0
 */
public class QueryCondition {

	private String name;  //用户输入参数
	private int pageNum;  //当前页数
	private int size;   //每页大小
	private int totalNum;  //总页数
	private String orderBy;  //排序依据
	private int orderByUsername;
	private int orderByRealName;
	private int orderByMobile;
	private String userIDs;
	
	public String getUserIDs() {
		return userIDs;
	}

	public void setUserIDs(String userIDs) {
		this.userIDs = userIDs;
	}

	public int getOrderByUsername() {
		return orderByUsername;
	}

	public void setOrderByUsername(int orderByUsername) {
		this.orderByUsername = orderByUsername;
	}

	public int getOrderByRealName() {
		return orderByRealName;
	}

	public void setOrderByRealName(int orderByRealName) {
		this.orderByRealName = orderByRealName;
	}

	public int getOrderByMobile() {
		return orderByMobile;
	}

	public void setOrderByMobile(int orderByMobile) {
		this.orderByMobile = orderByMobile;
	}

	public String getOrderBy() {
		return orderBy;
	}

	public void setOrderBy(String orderBy) {
		this.orderBy = orderBy;
	}

	public int getPageNum() {
		return pageNum;
	}

	public void setPageNum(int pageNum) {
		this.pageNum = pageNum;
	}

	public int getSize() {
		return size;
	}

	public void setSize(int size) {
		this.size = size;
	}

	public int getTotalNum() {
		return totalNum;
	}

	public void setTotalNum(int totalNum) {
		this.totalNum = totalNum;
	}

	public String getName() {
		return name;
	}
	
	public void setName(String name) {
		this.name = name;
	}
	
}

 User.java:

package entity;

import java.util.Date;

public class User {
	private String userID;
	private String email;
	private String askme;
	private String authenticate;
	private String password;
	private String username;
	private String nickname;
	private String leftSize;
	private Date registerTime;
	private UserInfo userInfo;
	
	public User(){
		
	}
	public User(String userID,String username,String realName,String mobile){
		this.username=username;
		this.userID=userID;
		userInfo=new UserInfo();
		this.userInfo.setRealName(realName);
		this.userInfo.setMobile(mobile);
	}
	
	public String getUserID() {
		return userID;
	}
	public void setUserID(String userID) {
		this.userID = userID;
	}
	public String getEmail() {
		return email;
	}
	public void setEmail(String email) {
		this.email = email;
	}
	public UserInfo getUserInfo() {
		return userInfo;
	}
	public void setUserInfo(UserInfo userInfo) {
		this.userInfo = userInfo;
	}
	public String getAskme() {
		return askme;
	}
	public void setAskme(String askme) {
		this.askme = askme;
	}
	public String getAuthenticate() {
		return authenticate;
	}
	public void setAuthenticate(String authenticate) {
		this.authenticate = authenticate;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
	public String getUsername() {
		return username;
	}
	public void setUsername(String username) {
		this.username = username;
	}
	public String getNickname() {
		return nickname;
	}
	public void setNickname(String nickname) {
		this.nickname = nickname;
	}
	public String getLeftSize() {
		return leftSize;
	}
	public void setLeftSize(String leftSize) {
		this.leftSize = leftSize;
	}
	public Date getRegisterTime() {
		return registerTime;
	}
	public void setRegisterTime(Date registerTime) {
		this.registerTime = registerTime;
	}
	

}

 UserInfo.java

package entity;

public class UserInfo {
	private String userID;
	private String realName;
	private String postcode;
	private String mobile;
	private String linkerPhone;
	private String userPost;
	private String department;
	private String userPhoto;
	private String userAddress;
	private String fax;
	private String usersex;
	private String userold;
	private String userdesc;
	private String provinceID;
	private String cityID;
	private String areaID;
	private User user;
	public String getUserID() {
		return userID;
	}
	public void setUserID(String userID) {
		this.userID = userID;
	}
	public String getRealName() {
		return realName;
	}
	public void setRealName(String realName) {
		this.realName = realName;
	}
	public User getUser() {
		return user;
	}
	public void setUser(User user) {
		this.user = user;
	}
	public String getPostcode() {
		return postcode;
	}
	public void setPostcode(String postcode) {
		this.postcode = postcode;
	}
	public String getMobile() {
		return mobile;
	}
	public void setMobile(String mobile) {
		this.mobile = mobile;
	}
	public String getLinkerPhone() {
		return linkerPhone;
	}
	public void setLinkerPhone(String linkerPhone) {
		this.linkerPhone = linkerPhone;
	}
	public String getUserPost() {
		return userPost;
	}
	public void setUserPost(String userPost) {
		this.userPost = userPost;
	}
	public String getDepartment() {
		return department;
	}
	public void setDepartment(String department) {
		this.department = department;
	}
	public String getUserPhoto() {
		return userPhoto;
	}
	public void setUserPhoto(String userPhoto) {
		this.userPhoto = userPhoto;
	}
	public String getUserAddress() {
		return userAddress;
	}
	public void setUserAddress(String userAddress) {
		this.userAddress = userAddress;
	}
	public String getFax() {
		return fax;
	}
	public void setFax(String fax) {
		this.fax = fax;
	}
	public String getUsersex() {
		return usersex;
	}
	public void setUsersex(String usersex) {
		this.usersex = usersex;
	}
	public String getUserold() {
		return userold;
	}
	public void setUserold(String userold) {
		this.userold = userold;
	}
	public String getUserdesc() {
		return userdesc;
	}
	public void setUserdesc(String userdesc) {
		this.userdesc = userdesc;
	}
	public String getProvinceID() {
		return provinceID;
	}
	public void setProvinceID(String provinceID) {
		this.provinceID = provinceID;
	}
	public String getCityID() {
		return cityID;
	}
	public void setCityID(String cityID) {
		this.cityID = cityID;
	}
	public String getAreaID() {
		return areaID;
	}
	public void setAreaID(String areaID) {
		this.areaID = areaID;
	}
	
	
	
}

 

接下来是最后最重要的页面:MyJsp.jsp

<%@ page language="java"  pageEncoding="utf-8" isELIgnored="false"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%
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>jsp 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">
	<style type="text/css">
		tbody .hover {background-color: gray;}
	</style>
	<script type="text/javascript" src="/test/js/jquery-1.3.2.js"></script>
	<script type="text/javascript">
		//给按钮绑定提交事件
		$(function(){
			$("#_button").click(function(){
				$("#pageNum").val("");
				tijiao();
			});
			$("#_delete").click(function(){
				deleteRecord();
			});
			$("#_content tr").hover(
			  function () {
				$(this).addClass("hover");
			  },
			  function () {
			    $(this).removeClass("hover");
			  });
			var totalNum=${queryCondition.totalNum};
			var pageNum=${queryCondition.pageNum};
		    for(var i=1;i<=totalNum;i++){
		    	if(pageNum == i){
		    		$("#_pageNum").append("<option value='" + i + "' selected='selected'>" + i + "</option>");
		    	}else{
		    		$("#_pageNum").append("<option value='" + i + "'>" + i + "</option>");
		    	}
		    }
		    var keywords = $("#_input").val();
			if(keywords){
				var value;
				var regExp = new RegExp(keywords,"g");
				$("._name").each(function(){
					value = $(this).html();
					value = value.replace(regExp,"<font color='red'>"+keywords+"</font>");
					$(this).html(value);
				});
			}
		});
		//监听键盘回车事件
		function enter_Key(event){
			if(event.keyCode == 13){
				$("#pageNum").val("");
				tijiao();
				return false;
			}
		}
		//跳转到指定页
		function goPage(pageNum){
			$("#pageNum").val(pageNum);
			tijiao();
		}
		//提交action
		function tijiao(){
			getJson();
		}	
		//通过ajax删除数据
		function ajaxDelete(){
			var data =  $("form").serialize(); 
			$.post("deleteRecord", data,
					   function(result){
					      fillPage(result); //填充table内容
					   }, "json");
		}
		//通过ajax提交请求(返回结果为json类型)
		function getJson(){
			var data =  $("form").serialize(); //序列化对象,将整个form中的属性全部放到data中
			$.post("getJson", data,
					   function(result){
					      fillPage(result);  //填充table内容
					   }, "json");
		}
		//填充table内容
		function fillPage(results){
			var content = $("#_content2");    
			content.empty();    //清空table的内容
			var num = results.users.length;
			var users = results.users;
			var user;
			//通过循环来遍历json数据,填充table
			for(var i=0;i<num;i++){
				user = users[i];
				content.append("<tr>"+
				    				"<td><input type='checkbox' id='"+user.userID+"' class='_userID'></td>"+
				    				"<td class='_name'>"+user.username+"</td>"+
				    				"<td class='_name'>"+user.userInfo.realName+"</td>"+
				    				"<td>"+user.userInfo.mobile+"</td>"+
	    						"</tr>");
			}
			//设置隐藏域中的属性
			$("#pageNum").val(results.queryCondition.pageNum); 
			$("#orderBy").val(results.queryCondition.orderBy);
			$("#_userIDs").val(results.queryCondition._userIDs);
			$("#_orderByUsername").val(results.queryCondition.orderByUsername);
			$("#_orderByRealName").val(results.queryCondition.orderByRealName);
			$("#_orderByMobile").val(results.queryCondition.orderByMobile);
			$("#_input").val(results.queryCondition.name);
			$("#_totalNum").empty();
			$("#_totalNum").append(results.queryCondition.totalNum);   // 修改总页数
			$("#_size").val(results.queryCondition.size);
			$("#_pageNum").empty(); 
			var totalNum = results.queryCondition.totalNum;
			var pageNum = results.queryCondition.pageNum;    // 修改当前页
			for(var i=1;i<=totalNum;i++){
		    	if(pageNum == i){
		    		$("#_pageNum").append("<option value='" + i + "' selected='selected'>" + i + "</option>");
		    	}else{
		    		$("#_pageNum").append("<option value='" + i + "'>" + i + "</option>");
		    	}
		    }
		    //修改button的disable属性
		    if(totalNum<=1){
				$("#_firstPage").attr("disabled",true);
				$("#_previousPage").attr("disabled",true);
				$("#_nextPage").attr("disabled",true);
				$("#_lastPage").attr("disabled",true);
			}else if(totalNum>1){
				if(pageNum>1){
					if(pageNum<totalNum){   //总页数大于当前页数  并且当前页数大于1
						$("#_firstPage").attr("disabled",false);
						$("#_previousPage").attr("disabled",false);
						$("#_nextPage").attr("disabled",false);
						$("#_lastPage").attr("disabled",false);
					}else if(pageNum==totalNum){   //总页数大于1  并且当前页数等于总页数
						$("#_firstPage").attr("disabled",false);
						$("#_previousPage").attr("disabled",false);
						$("#_nextPage").attr("disabled",true);
						$("#_lastPage").attr("disabled",true);
					}
				}else if(pageNum==1){   //总页数大于1  并且当前页数等于1
					$("#_firstPage").attr("disabled",true);
					$("#_previousPage").attr("disabled",true);
					$("#_nextPage").attr("disabled",false);
					$("#_lastPage").attr("disabled",false);
				}
			}
			//鼠标hover的时候背景变色
		    $("#_content tr").hover(
					  function () {
						$(this).addClass("hover");
					  },
					  function () {
					    $(this).removeClass("hover");
			});
                        对关键字进行变色处理,关键字变红色
			var keywords = $("#_input").val();
			if(keywords){
				var value;
				var regExp = new RegExp(keywords,"g");//string.replace需要一个RegExp对象
				$("._name").each(function(){
					value = $(this).html();
					value = value.replace(regExp,"<font color='red'>"+keywords+"</font>");
					$(this).html(value);
				});
			}
		}	
		//删除选中记录
		function deleteRecord(){
			var userIDs="";
			$("input:checked._userID").each(function(){
				userIDs+=$(this).attr("id")+","
			});
			if("" != userIDs){
				userIDs = userIDs.substr(0,userIDs.length-1);
				$("#_userIDs").val(userIDs);
				ajaxDelete();
			}else if("" === userIDs){
				alert('请选择要删除的记录');
			}
			
		}
		//跳转第一页
		function goFirst(){
			$("#pageNum").val(1);
			tijiao();
		}
		//跳转上一页
		function goPrevious(){
			var n=parseInt($("#pageNum").val())-1;
			$("#pageNum").val(n);
			tijiao();
		}
		//跳转下一页
		function goNext(){
			var n=parseInt($("#pageNum").val())+1; 
			$("#pageNum").val(n);
			tijiao();
		}
		//跳转最后一页
		function goLast(){
			$("#pageNum").val(${queryCondition.totalNum});
			tijiao();
		}
		//点击表头排序
		var orderByUsername ;
		var orderByRealName ;
		var orderByMobile ;
		function orderBy(i){
			if(i == 1){
				return;
			}else if(i == 2){
				if($("#_orderByUsername").val()){
					orderByUsername = parseInt($("#_orderByUsername").val());
				}else{
					orderByUsername=1;
				}
				orderByUsername++;
				$("#_orderByUsername").val(orderByUsername);
				if(orderByUsername%2==0){
					$("#orderBy").val("username");
				}else if(orderByUsername%2==1){
					$("#orderBy").val("username desc");
				}
			}else if(i == 3){
				if($("#_orderByRealName").val()){
					orderByRealName = parseInt($("#_orderByRealName").val());
				}else{
					orderByRealName=1;
				}
				orderByRealName++;
				$("#_orderByRealName").val(orderByRealName);
				if(orderByRealName%2==0){
					$("#orderBy").val("realName");
				}else if(orderByRealName%2==1){
					$("#orderBy").val("realName desc");
				}
			}else if(i == 4){
				if($("#_orderByMobile").val()){
					orderByMobile = parseInt($("#_orderByMobile").val());
				}else{
					orderByMobile=1;
				}
				orderByMobile++;
				$("#_orderByMobile").val(orderByMobile);
				if(orderByMobile%2==0){
					$("#orderBy").val("mobile");
				}else if(orderByMobile%2==1){
					$("#orderBy").val("mobile desc");
				}
			}
			tijiao();
		}
		//全选
		function checkAll(){
			$("._userID").each(function(){
				$(this).attr('checked',true);
			});
		}
		
		function unCheckAll(){
			$("._userID").each(function(){
				$(this).attr('checked',false);
			});
		}
	</script>
  </head>
  <body>
    <form id="myAction" action="testAction" method="post">
    	<table align="center" cellspacing="0" border="0" width="80%">
    		<tr>
    			<td width="30%">用户名或真实名:
    				<input type="text" id="_input" name="queryCondition.name" value="${queryCondition.name}" onkeydown="return enter_Key(event)">
    			</td>
    			<td align="left" width="10%"><input type="button" value="搜索" id="_button"></td>
    			<td width="20%"></td>
    			<td width="20%"></td>
    		</tr>
    	</table>
    	<br/>
    	<div id="_content">
    	<table align="center" cellspacing="0" border="1" width="80%"  rules="all">
    	<thead>
    		<tr>
    			<th width="10%"><input type="checkbox" id="_checkAll" onclick="checkAll()">全选/反选</th>
    			<th onclick="orderBy(2)" width="20%">用户名</th>
    			<th onclick="orderBy(3)" width="20%">真实姓名</th>
    			<th onclick="orderBy(4)" width="30%">手机号</th>
    		</tr>
    		</thead>
    		<tbody id="_content2">
    		<s:iterator value="users" var="user" status="status">
    			<tr>
    				<td><input type="checkbox" id="${userID}" class="_userID"></td>
    				<td class="_name"><s:property value="#user.username" escape="false"/></td>
    				<td class="_name"><s:property value="#user.userInfo.realName" escape="false"/></td>
    				<td><s:property value="#user.userInfo.mobile" escape="false"/></td>
    			</tr>
    		</s:iterator>
    		</tbody>
    	</table>
    	</div>
    	
		<table align="center" cellspacing="0" border="0" width="80%">
			<tr>
				<td><input type="button" onclick="checkAll()" value="全选">
				<input type="button" onclick="unCheckAll()" value="取消">
				<input type="button" id="_delete" value="删除"></td>
				<td id="_footer">			
		    		一共<span id="_totalNum">
		    		<s:if test="queryCondition.totalNum>0"><s:property value="queryCondition.totalNum"/></s:if></span>页
		    		每页显示
		    		<select name="queryCondition.size" onchange="tijiao()" id="_size">
		    			<s:if test="queryCondition.size == 25">
			    			<option value="25" selected="selected">25</option>
			    			<option value="50">50</option>
			    			<option value="75">75</option>
		    			</s:if>
		    			<s:elseif test="queryCondition.size == 50">
		    				<option value="25">25</option>
			    			<option value="50" selected="selected">50</option>
			    			<option value="75">75</option>
		    			</s:elseif>
		    			<s:elseif test="queryCondition.size == 75">
		    				<option value="25">25</option>
			    			<option value="50">50</option>
			    			<option value="75" selected="selected">75</option>
		    			</s:elseif>
		    			<s:else>
		    				<option value="25" selected="selected">25</option>
			    			<option value="50">50</option>
			    			<option value="75">75</option>
		    			</s:else>
		    		</select>
		    		条
		    		第<s:if test="queryCondition.totalNum>0">
		    		<select name="pageNum" onchange="goPage(this.value)" id="_pageNum">
							    			
		    		</select>
		    		</s:if>页
		    	</td>
				<td>
			    	<s:if test="queryCondition.pageNum>0&&queryCondition.totalNum>0&&queryCondition.pageNum!=1">
			    				<input type="button"  onclick="goFirst();" value="第一页" id="_firstPage"></s:if>
			    	<s:else><input type="button"  onclick="goFirst();" value="第一页" disabled="disabled" id="_firstPage"></s:else>
		    	
			    	<s:if test="queryCondition.totalNum>1&&queryCondition.pageNum>1">
			    				<input type="button"  onclick="goPrevious()" value="上一页" id="_previousPage"></s:if>
			    	<s:else><input type="button"  onclick="goPrevious()" value="上一页" disabled="disabled" id="_previousPage"></s:else>
		    				
			    	<s:if test="queryCondition.totalNum>1&&(queryCondition.pageNum lt queryCondition.totalNum)">
			    				<input type="button"  onclick="goNext()" value="下一页" id="_nextPage"></s:if>
			    	<s:else><input type="button"  onclick="goNext()" value="下一页" disabled="disabled" id="_nextPage"></s:else>	
		    	
			    	<s:if test="queryCondition.totalNum>0&&queryCondition.pageNum!=queryCondition.totalNum">
			    				<input type="button"  onclick="goLast()" value="最后一页" id="_lastPage"></s:if>
			    	<s:else><input type="button"  onclick="goLast()" value="最后一页" disabled="disabled" id="_lastPage"></s:else>	
		    	</td>
		    	<td width="20%"></td>
	    	</tr>
    	</table>
    	<s:if test="queryCondition.totalNum>0">
    				<input type="hidden" id="pageNum" name="queryCondition.pageNum" value="${queryCondition.pageNum}"></s:if>
    	<input type="hidden" id="orderBy" name="queryCondition.orderBy">
    	<input type="hidden" id="_userIDs" name="queryCondition.userIDs">
    	<input type="hidden" id="_orderByUsername" name="queryCondition.orderByUsername" value="${queryCondition.orderByUsername}">
    	<input type="hidden" id="_orderByRealName" name="queryCondition.orderByRealName" value="${queryCondition.orderByRealName}">
    	<input type="hidden" id="_orderByMobile" name="queryCondition.orderByMobile" value="${queryCondition.orderByMobile}">
    </form>
  </body>
</html>

 

 

 

好的,完工。。。其中的一些代码都写了注释,比较啰嗦,也没进行优化之类的。。。

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics