最近被easayUI的风格吸引了,所以做了一个Struts2+EasyUI的简单登陆
重点在页面JS的编写,代码如下:
var loginForm;
$(function(){
loginForm=$("#logForm").dialog({
title:'登陆',
draggable:false,
closable:false,
modal:true,
buttons:[
{
text:'重置',
iconCls:'icon-add',
handler:function(){
$("#logForm").form('clear');
}
},{
text:'登陆',
iconCls:'icon-ok',
handler:function(){
$.ajax({
type:'post',
//传递地址
url:'loginAction.action',
//传递参数类型
dataType:'json',
//序列化表单参数
data:$('#logForm').serialize(),
success:function(data){
//传递完成之后关闭dialog
$("#logForm").dialog("close");
$("#show").html(data.result);
}
});
}
}
]
});
});
</script>
</head>
<body>
<div id="show"></div>
<form id="logForm" method="post">
<table>
<tr>
<td><label>用户名:</label>
</td>
<td>
<input type="text" id="username" name="user.username" >
</td>
</tr>
<tr>
<td><label>密码:</label></td>
<td>
<input type="password" id="password" name="user.password" >
</td>
</tr>
</table>
</form>
在struts.xml中,只需要指定Action的映射就和返回类型就可以了
<struts>
<package name="json" extends="json-default" namespace="/">
<action name="loginAction" class="calm.Action.LoginAction">
<result name="success" type="json"></result>
</action>
</package>
</struts>
Action的编写如下:
private User user;
private String result;
public User getUser() {
return user;
}
public void setUser(User user) {
this.user = user;
}
public String getResult() {
return result;
}
public void setResult(String result) {
this.result = result;
}
@Override
public String execute() throws Exception {
result ="异步登录成功!"+"+用户名: "+user.getUsername()+" 密码: "+user.getPassword();
System.out.println(result);
return "success";
}
总结:在关闭dialog的时候,使用了传递参数完成之后才关闭dialog,感觉这是一个瑕疵,应该是后台传递一个参数过来然后在关闭。