Struts2中的Action配合jQuery和Ajax操作

最新推荐文章于 2018-07-01 11:43:19 发布

luoxia0805

最新推荐文章于 2018-07-01 11:43:19 发布

阅读量688

点赞数

分类专栏： web 前端成长之路

本文链接：https://blog.youkuaiyun.com/luoxia0805/article/details/28709601

版权

web 前端成长之路专栏收录该内容

9 篇文章

订阅专栏

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

想通过在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">
   
   <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>
    
    
<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/>
                
                             <input id="Button1" type="button" class="btn" value="登录"/>
                
                           <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配置信息:

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;
        }
   }

测试结果: