easyUI--dialog, form
本人测试案例
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery EasyUI demo</title>
<link rel="stylesheet" href="../jquery-easyui-1.3.1/themes/icon.css" type="text/css"></link>
<link rel="stylesheet" href="../jquery-easyui-1.3.1/themes/default/easyui.css" type="text/css"></link>
<script type="text/javascript" src="../jquery-easyui-1.3.1/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../jquery-easyui-1.3.1/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../jquery-easyui-1.3.1/locale/easyui-lang-zh_CN.js"></script>
</head>
<script type="text/javascript">
var loginDialog;
var loginInputForm;
$(function() {
loginDialog = $("#loginDialog").dialog(
{
title : "登入",
modal : true,
closable : false,
cache : false,
resizable : true,
buttons : [
{
text : '重置',
disabled : true,
handler : function() {
}
},
{
text : '登入1',
handler : function() {
loginInputForm = $("#loginInputForm").form('submit', {
url : "/demo/userAction!doNotNeedSession_login.action",
onSubmit : function() {
},
success : function(data) {
data = eval('(' + data + ')'); // change the JSON string to javascript object
console.info("Success Saved: " + data.msg);
},
onLoadSuccess : function(data) {
console.info(1);
loginInputForm.form("clear");
}
});
}
},
{
text : '登入2',
handler : function() {
$.messager.progress();
$.ajax({
type : "POST",
url : "/demo/userAction!doNotNeedSession_login.action",
data : "cname=" + $("#loginInputForm[name='cname']")
+ "&cpwd=" + $("#loginInputForm[name='cpwd']"),
data : $("#loginInputForm").serialize(),
dataType : "json",
success : function(msg) {
$.messager.progress("close");
console.info("Success Saved: " + msg.msg);
var curWwwPath = window.document.location.href;
var pathName = window.document.location.pathname;
var pos = curWwwPath.indexOf(pathName);
var localhostPaht = curWwwPath.substring(0, pos);
var projectName = pathName.substring(0, pathName
.substr(1).indexOf('/') + 1);
console.info($("#loginInputForm").serialize());
console.info(curWwwPath + "-" + pathName);
console.info(localhostPaht + "-" + projectName);
}
});
}
}, {
text : '登入3',
handler : function() {
console.info("登入3");
loginInputForm = $("#loginInputForm").form("submit", {
url : "/demo/userAction!doNotNeedSession_login.action",
onSubmit : function() {
console.info("onSubmit");
},
success : function(data) {
data = eval('(' + data + ')'); // change the JSON string to javascript object
console.info("Success Saved: " + data.success);
if (data.success == false) {
$.messager.alert('Warning', 'The warning message');
$.messager.show({
title : 'My Title',
msg : data.msg,
timeout : 5000,
showType : 'slide'
});
} else {
loginDialog.dialog("close");
}
},
onLoadSuccess : function(data) {
console.info("onLoadSuccess");
},
load : function(data) {
console.info("load");
}
});
}
} ]
});
});
</script>
<body>
<div id="loginDialog" style="width: 400px; height: 200px;">
<form id="loginInputForm" method="post">
<table>
<tr>
<th>
用户名:
</th>
<td>
<input name="cname" class="easyui-validatebox" data-options="required:true,validType:'email'" />
</td>
</tr>
<tr>
<th>
密码:
</th>
<td>
<input name="cpwd" class="easyui-validatebox" data-options="required:true,validType:'email'" />
</td>
</tr>
</table>
</form>
</div>
</body>
</html>