$(function(){
//easyui 提供了一个datagrid 控件 去完成table初始化
//参数是object类型
$('#mytable').datagrid({
title:'用户信息',
onDblClickRow:function(index,row){
var url ='<%=path%>/edit.jsp?';
var count = 0;
for(var i in row){
if(count!=0){ url+="&"; //请教一下这个什么意思了 url+="&";
}
url+=i+"="+row[i]; //请教一下这个什么意思了
count++;
}
//本地位置
location.href=url;
//history go forword back
//document getElementById getElementsByTagName
},
url:'<%=path%>/userlist.action',//获取数据的地址json格式的数据 {total:10,rows:[{},{},{},{}]}
columns:[[
{field:'uid',title:'编号'},
{field:'uname',title:'姓名'},
{field:'upwd',title:'密码'},
{field:'usex',title:'性别'},
{field:'uage',title:'年龄'},
{field:'umoney',title:'余额'}
]],
pagination:true,
pageList:[5,10,20],
loadMsg:'玩命加载中...',
toolbar: [{
iconCls: 'icon-add',
text:'添加',
handler: function(){alert('编辑按钮')}
},{
iconCls: 'icon-cut',
text:'删除',
handler: function(){
//获取选中的行对象 返回的是对象数组
var rows = $('#mytable').datagrid('getSelections');
if(rows.length==0){
alert('请选中需要删除的行!');
return;
}
var url = "<%=path%>/del.action?";
for(var i in rows){
var row = rows[i];
if(i!=0){
url+="&";
}
url+="ids="+row.uid;
}
alert(url);
$.get(url,function(success){
success = Number(success);
if(success==0){
alert("删除成功!");
$('#mytable').datagrid('reload');
}else{
alert("删除失败!");
}
});
}
},{
iconCls: 'icon-edit',
text:'修改',
handler: function(){alert('帮助按钮')}
}]
});
});
function search(){
var uname = $('#uname').val();
var usex = $('#usex').val();
var uage = $('#uage').val();
$('#mytable').datagrid('load',{
uname: uname,
usex: usex,
uage:uage
});
}
</script>
</head>
<body>
<!-- 展示用户信息 -->
姓名(支持模糊查询):<input type="text" id="uname" />
性别:<select id="usex">
<option>全部</option>
<option>男</option>
<option>女</option>
</select>
年龄:<input type="text" id="uage" />
<button id="btn" onclick="search()" class="easyui-linkbutton" data-options="iconCls:'icon-search'">查询</button>
<table id="mytable">
</table>
</body>
相关分类