Struts2中的Action配合jQuery和Ajax操作

来源:互联网 发布:erp软件系统 编辑:程序博客网 时间:2024/05/17 07:44

感谢这两位朋友游目骋怀和一梦春秋的原创分享

       想通过在jsp页面上点击某个按钮Ajax实现与服务器端的交互,然后是通过配置struts.xml跳转到服务器端某个Action进行处理,最常用的就是注册,登录的用户名验证了.主要的思路:      

       1、客户端是通过$.ajax()方法向struts2.action传递数据;

       2、其中action中execute()方法返回值为空通过【ServletActionContext.getResponse().getWriter().print(result);】方法将数据传到jQuery


     TestAjax.jsp代码:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
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>struts+jquery+ajax</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">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <style type="text/css">
     body{font-size:15px}
    .divFrame{width:250px;border:solid 1px #666;margin:100px;}

    .divFrame .divTitle{padding:5px;background-color:#eee}

    .divFrame .divContent{padding:8px}

    .divFrame .divContent .clsShow{font-size:14px}

    .btn{border:#666 1px solid;padding:2px;width:50px;

    filter:progid:DXImageTransform.Microsoft

    .Gradient(GradientType=0,StartColorStr=#ffffff,

    EndColorStr=#ECE9D8);}

    form{padding:0px;margin:0px}

    }

    </style>
    <script type="text/javascript" src="js/jquery1.9.1.js"></script>

    <script type="text/javascript">

       $(function(){
       
           $("#Button1").click(function(){
              var mName=encodeURI($("#mname").val());
              var mPass=encodeURI($("#mpass").val());
             // alert(mName);
              $.ajax(
              {
                  url:"<%=basePath%>/test/login",//<%=basePath%>/test/login
                  dataType:"html",
                  data:{mname:mName,//发送给服务器的数据
                      mpass:mPass},
                  success:function(strValue)
                  {
                     alert(strValue);                    
                     if(strValue=="true"){
                         $("#divTip").html("操作提示,登录成功!");
                     }else
                     {
                         $("#divTip").html("用户名或密码错误!");
                     }
                  }
              });
           });
       });  
    </script>        
  </head>
 
  <body>
    <!-- 1.客户端通过$.ajax()方法向struts2.action传递数据 -->
    <!-- 2.action中execute()方法返回值为空,通过ServletActionContext.getResponse.getWriter().print(result)方法将数据传到jQuery中 -->
 
  <body>
    <div class="divFrame">
            <div class="divTitle">用户登录</div>
         <div class="divContent">
              <div id="divTip"></div>
              <div id="box">
                 <form id="myForm">
                       名称:<input type="text" id="mname" name="mname"/><br/>
                        密码:<input type="password" id="mpass" name="mpass"/><br/>
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                             <input id="Button1" type="button" class="btn" value="登录"/>
               &nbsp;
                           <input id="Button2" type="reset" class="btn" value="取消"/>
                </form>
        </div>

    </div>

    </div>

    <br/>

    本网页显示的是通过$.ajax()方法向struts2.action传递数据,<br/>其中action中execute()方法返回为空,<br/>并通过【ServletActionContext.getResponse().getWriter().print(result);】 方法将数据传到jQuery中。

  </body>
  </body>
</html>


struts.xml配置信息:

<package name="test" namespace="/test" extends="struts-default">
     <action name="login" class="test.LoginCheckAction">    
     </action>
</package>

LoginCheckAction.java代码:

package test;
import org.apache.struts2.ServletActionContext;

import com.opensymphony.xwork2.ActionSupport;

public class LoginCheckAction extends ActionSupport {
        /**
     *
     */
    private static final long serialVersionUID = 1L;
        private String mname;
        private String mpass;
        /*getter和setter方法*/
        public void setMname(String mname){
            this.mname=mname;
        }
        public String getMname(){
            return this.mname;
        }
        public String getMpass(){
            return this.mpass;
        }
        public void setMpass(String mpass){
            this.mpass=mpass;
        }
        
        public String execute() throws Exception {
                boolean result=false;
                if("abc".equals(mname)&& "123".equals(mpass))
                {
                        result=true;
                }
           //向客户端传递数据
              ServletActionContext.getResponse().getWriter().print(result);

            return null;
        }
    }


测试结果:





     


0 0
原创粉丝点击