<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>管理人員信息頁面</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="scripts/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="scripts/themes/icon.css">
<script type="text/javascript" src="scripts/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="scripts/jquery.easyui.min.js"></script>
<script type="text/javascript" src="scripts/locale/easyui-lang-zh_CN.js"></script>
<script src="scripts/calendar/WdatePicker.js" type="text/javascript"></script>
<script src="scripts/default.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#test').datagrid({
url:'user!login.c',
title: '管理人員',
width:'auto',
height:'200',
nowrap: true,
fit:true,
striped: true,
singleSelect:true,
fitColumns: true,
collapsible:true,
pagination:true,
rownumbers:true,
pageList:[15,20,30,50],
pageSize:20,
sortName : 'code',
sortOrder : 'desc',
remoteSort : false,
idField : 'code', // 這是ID位置，循環要用到的
toolbar:[
{
field : 'ck',
checkbox : true // 添加複選框
},
iconCls:'icon-add',
handler:function(){addOrEdit('add');}
},'-',
{ text:'修改',
iconCls:'icon-edit',
handler:function(){addOrEdit('edit');}
},'-',
{ text:'刪除',
iconCls:'icon-del',
handler:function(){del();}
},'-',
{ text:'禁用',
iconCls:'icon-no',
handler:function(){changeStatus(true);}
},'-',
{ text:'啓用',
iconCls:'icon-ok',
handler:function(){changeStatus(false);}
}
],
columns:[[
{field:'id',title:'ID號碼',width:20},
{field:'username',title:'用戶名稱',width:20},
{field:'password',title:'密碼',width:20},
{field:'address',title:'地址',width:20},
/// {field:'disabled',title:'是否可用',width:20}
{field:'disabled',title:'狀態',width:20,styler:function(value,row,index){return value=='禁用'?'color:red;':'';}}//可以實現效果的形式。
{field:'id',title:'編輯',width:100,align:'center',
formatter:function(value, row, index){
return '<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:icon-edit,plain:true" οnclick="edit();">編輯</a>';
}
]]
});
});
function changeStatus(disable){
var row = $('#test').datagrid('getSelected');
if (row){
var jy = row.disabled == "禁用";
if(disable == jy) return false;
var op = disabled ? "啓用" : "禁用";
$.messager.confirm(op, "確認" + op + "選中的記錄？", function(r){
if (r){//確定刪除
$.ajax({
type: "POST",
url: "user!Change.c",
data: "id="+row.id+"&disable="+disable,
cache : false,
dataType:"json",
success: function(json){
if(json.success){
$('#test').datagrid("reload");
}else{
$.messager.alert('信息提示',json.error,'info');
}
}
});
}
});
}else{
$.messager.alert('信息提示','請選擇要操作的記錄。','info');
}
}
function addOrEdit(type){
var row = $("#test").datagrid("getSelected");
if(type=='add'){
popBox("新增管理人員","user!add.c","700","350");
}else if(row){
popBox("修改管理人員","user!add.c?id="+row.id,"700","350");
}else{
alert("請選擇一條需修改的記錄");
}
}
function del(){
var row = $("#test").datagrid("getSelected");
if(row){
$.messager.confirm("刪除", "確認刪除選中的記錄？", function(r){
if (r){//確定刪除
$.ajax({
type: "POST",
url: "user!del.c",
data: "id="+row.id,
cache : false,
dataType:"json",
success: function(json){
if(json=="1"){
$('#test').datagrid("reload");
}else{
$.messager.alert('信息提示','刪除失敗','info');
}
}
});
}
});
}
}
</script>
</head>
<body class="easyui-layout">
<div region="center" style="overflow:hidden;width:auto; padding:0px 5px 0px 5px; background:#efefef"; border="false">
<table id="test"></table>
</div>
</body>
</html>