<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css"
href="${pageContext.request.contextPath}/themes/gray/easyui.css">
<link rel="stylesheet" type="text/css"
href="${pageContext.request.contextPath}/themes/icon.css">
<script type="text/javascript"
src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
<script type="text/javascript"
src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
<script type="text/javascript"
src="${pageContext.request.contextPath}/js/easyui-lang-zh_CN.js"></script>
</head>
<script type="text/javascript">
$(function() {//文档就绪
//初始化表格
$("#dg").datagrid({
url : "list",
method : "post",
pagination : true,//分页
fitColumns : true,
striped : true,
rownumbers : true,
pageSize : 10,
pageList : [ 5, 10, 15, 20 ],
loadMsg : "正在玩命加载中。。。",
columns : [ [ {
field : 'sid',
title : 'ID',
width : 80,
checkbox : true
},//一列
{
field : 'sname',
title : '姓名',
width : 100
},
{
field : 'path',
title : '照片',
width : 100
},{
field:'p',
title : '省',
formatter:function(value){
return value.pname
},
width:100
},{
field:'c',
title : '市',
formatter:function(value){
return value.cname
},
width:100
},{
field:'cu',
title : '县',
formatter:function(value){
return value.cuname
},
width:100
}
] ],
toolbar : [ {
iconCls : 'icon-edit',
text : "修改",
handler : function() {
rows = $("#dg").datagrid('getSelections');
len = rows.length;
if (len == 0) {
$.messager.alert('提示', '请至少选择一条');
return;
}
if (len > 1) {
$.messager.alert('提示', '只能选择一条');
return;
}
//获取选中的数据
alert(rows[0].name);
$('#ff').form('load', {
uid : rows[0].uid,
name : rows[0].uname,
age : rows[0].age,
});
flag = "update";
//打开对话框
$("#dd").dialog("open");
$("#dd").dialog("setTitle", "修改");
$('#fg').combobox('setValue', rows[0].tid);
$('#ff').form('load', {
uid : rows[0].uid,
uname : rows[0].uname,
zage : rows[0].age
});
}
}, '-', {
iconCls : 'icon-remove',
text : "删除",
handler : function() {
rows = $("#dg").datagrid('getSelections');
len = rows.length;//得到删除id的数量
if (len != 0) {
var sid = "";
$(rows).each(function() {
sid += this.sid + ","
});
sid = sid.substring(0, sid.length - 1);
alert(sid);
$.post("/m/de", {
sid : sid
}, function(data) {
$.messager.alert('提示', data.msg);
$("#dg").datagrid("reload");
}, "json");
$("#dg").datagrid("reload");
}
}
}, '-', {
iconCls : 'icon-add',
text : "增加",
handler : function() {
$("#dd").dialog("open");
$("#dd").dialog("init");
}
} ]
});
//给对话框加两个按钮，设置属性buttons
$("#dd").dialog(
{
buttons : [
{
text : '保存',
handler : function() {
alert("保存数据");
// 表单验证通过？否:不会发送请求 是：发送后台请求
isvalidate = $("#ff").form("validate");
if (isvalidate) {//提交 是：发送后台请求
//发送后台请求 ajax:url,表单数据处理，回调函数（提示是否成功）
fdata = $("#ff").serialize();//表单数据处理 name=zhangsan&email=sfsf
$
.post(
"${pageContext.request.contextPath}/addAndUpdate",
function(data) {
$.messager.alert(
'提示',
data.msg);
//刷新列表页
$("#dg").datagrid(
"reload");
$("#dd").dialog(
"close");//关闭对话框
}, "json");
}
}
}, {
text : '取消',
handler : function() {
$("#dd").dialog("close");//关闭对话框
}
} ]
});
//关闭对话框
$("#dd").dialog("close");
//初始化下拉列表
$("#fg").combobox({
url : "/m/p",
valueField : 'pid',
textField : 'pname',
method : "get",
});
//改变事件
$("#fg").change(function() {
alert("wq");
var pid=$(this).val();
alert(pid);
/* $.post(
"/m/c",
{pid:pid},
"json"
); */
});
});
function test_post() {
var testform = document.getElementById("fquery");
testform.action = "${pageContext.request.contextPath }/sele";
testform.submit();
}
</script>
<body>
<div data-options="region:'center',title:'center title'"
style="padding: 5px; background: #eee;">
<table id="dg">
</table>
</div>
<!-- 增加 修改 对话框 三级联动 -->
<div id="dd" class="easyui-dialog" title="增加"
style="width: 400px; height: 400px;"
data-options="iconCls:'icon-save',resizable:true,modal:true">
<form id="ff" method="post">
<br />
<div>
<input class="easyui-validatebox" type="hidden" name="sid" />
</div>
<br /> <br />
<div>
<label for="name">姓名:</label>
<input class="easyui-validatebox" type="text" name="uname" data-options="required:true" />
</div>
<br />
<div>
<label for="path">照片:</label>
<input class="easyui-validatebox" type="file" name="path" data-options="required:true" />
</div>
<div>
省：<input id="sheng" class="easyui-combobox" style="width:100px"
data-options="
url:'/m/p',
valueField:'pid',
textField:'pname',
onSelect:function(Province){
var pid=Province.pid;
$('#shi').combobox('clear');//清除原有项目
$('#qu').combobox('clear');//清除原有项目
$('#shi').combobox('reload','/m/c?pid='+pid);//重新加载市
$('#qu').combobox('reload','/m/cu')//重新加载区
}" />
市：<input id="shi" class="easyui-combobox" style="width:100px"
data-options="
url:'/m/c',
valueField:'cid',
textField:'cname',
onSelect:function(City){
var cid=City.cid;
$('#qu').combobox('clear');//清除原有项目
$('#qu').combobox('reload','/m/cu?cid='+cid);
}" />
区：<input id="qu" class="easyui-combobox" style="width:100px"
data-options="
url:'/m/cu',
valueField:'cuid',
textField:'cuname'"
/>
</form>
</div>
<body></html>
1333
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
