(Struts2学习篇) Struts2之Jquery整合-蒲公英云

(Struts2学习篇) Struts2之Jquery整合

冷不防 2023-10-16 20:18 81阅读 0赞

主要思路：

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

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

相关源代码：

struts.xml配置文件

<package name="struts2.action" extends="struts-default">
    <action name="loginUser" class="com.vixuan.skydrive.action.LoginActions">
    </action>
    </package>

登入Action（LoginActions）

package com.vixuan.skydrive.action;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;
public class LoginActions extends ActionSupport {
    /**
     * 
     */
    private static final long serialVersionUID = 1L;
    private String mname;
    private String mpass;
    /* 省略getter和setter方法 */
    public String execute() throws Exception {
        boolean result = false;
        if ("root".equals(mname) && "123456".equals(mpass))
        {
            result = true;
        }
        // 向客户端传递数据
        ServletActionContext.getResponse().getWriter().print(result);
        return null;
    }
    public String getMname() {
        return mname;
    }
    public void setMname(String mname) {
        this.mname = mname;
    }
    public String getMpass() {
        return mpass;
    }
    public void setMpass(String mpass) {
        this.mpass = mpass;
    }
}

用户登入Html(Login.html)

<html>
<head>
<title>jQuery与Struts2的整合</title>
<meta http-equiv="content-type" content="text/html; charset=GBK">
<style type="text/css">
body {
    font-size: 13px
}
.divFrame {
    width: 250px;
    border: solid 1px #666
}
.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/jquery-1.9.1.js"></script>
<script type="text/javascript">
       $(function()
       {
           $("#Button1").click(function(){ 
              var mName=encodeURI($("#mname").val());
              var mPass=encodeURI($("#mpass").val());
              $.ajax(
              {
                  url:"loginUser.action",
                  dataType:"html",
                  data:{mname:mName,
                       mpass:mPass},
                  success:function(strValue)
                  {
                     alert(strValue);
                     if(strValue=="true"){
                         $("#divTip").html("操作提示，登录成功！");
                     }else
                     {
                         $("#divTip").html("用户名或密码错误！");
                     }
                  }
              })
           })
       })
    </script>
</head>
<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>
</html>