JQuery EasyUI(55)
郑俊彦
第三十九章： 后台管理界面--管理员管理[3]
学习要点：
- 修改管理员
//manager.php
<?php
session_start();
if(!isset($_SESSION['admin'])){
header('location:login.php');
}
?>
<table id="maneger"></table>
<div id="manager_tool" style="padding:5px;">
<div style="margin-buttom:5px;">
<a href="#" class="easyui-linkbutton" iconCls="icon-add-new" plain="true" οnclick="manager_tool.add();">添加</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-deit-new" plain="true" οnclick="manager_tool.edit();">修改</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-delete-new" plain="true"
οnclick="obj.remove();">删除</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" id="save">保存</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-redo" plain="true" id="redo">取消编辑</a>
</div>
<div style="padding:0 0 0 7px;color='#ccc'">
查询账号：<input type="text" name="user" class="textbox" style="width:100px">
创建时间从：<input type="text" name="date_from" class="easyui-datebox"
editable="false" style="width:100px"> 到：<input type="text" name="date_to" class="easyui-datebox" editable="false" style="width:100px">
<a href="#" class="easyui-linkbutton" iconCls="icon-search" οnclick="obj.search();">查询</a>
</div>
</div>
<form id="manager_add" style="margin:0;padding:5px 0 0 25px;color:#333;">
<p>账号管理：<input type="text" name="manager" class="textbox" style="200px"></p>
<p>管理密码：<input type="password" name="password" class="textbox" style="200px"></p>
<p>分配权限：<input id="auth" name="auth" class="textbox" style="205px"></p>
</form>
<form id="manager_edit" style="margin:0;padding:5px 0 0 25px;color:#333;">
<input type="hidden" name="id" class="textbox" style="200px">
<p>账号管理：<input type="text" name="manager_edit" disable="true" class="textbox" style="200px"></p>
<p>管理密码：<input type="password" name="password_edit" class="textbox" style="200px"></p>
<p>分配权限：<input id="auth_edit" name="auth_edit" class="textbox" style="205px"></p>
</form>
<script type="text/javascript" src="js/manager.js"></scrtpt>
//manager.js
$(function(){
$('#manager').datagrid({
url:'manager_data.php';
fit:true;
fitColumns:true;
striped:true;
rownumbers:true;
border:false;
pagination:true;
pageSize:20;
pageList:[10,20,30,40,50];
pageNumber:1;
sortName:'date';
sortOrder:'desc';
toolbar:'#manager_tool';
columns:[[
{
field:'id';
title:'自动编号';
width:200px;
checkbox:true;
}
{
field:'manager';
title:'管理员账号';
width:200px;
}
{
field:'auth';
title:'拥有权限';
width:200px;
}
{
field:'date';
title:'创建日期';
width:200px;
}
]];
});
$('#manager_add').dialog({
width:350,
title:'新增管理',
modal:true,
closed:true,
iconCls:'icon-user-add',
buttons:[{
text:'提交',
iconCls:'icon-add-new',
headler:function(){
if($('#manager_add').from('validate')){
$.ajax({
url:'addManager.php',
type:'post',
data:{
manager:$('input[name="manager"]').val,
password:$('input[name="password"]').val,
auth:$('#auth').comboTree('getText'),
},
beforeSend:function(){
$.message.progress({
text:'正在新增中……',
});
},
success:function(data,response,status){
$.message.progress('close');
if(data>0){
$.message.show({
title:'提示',
msg:'新增管理成功！',
});
$('#manager_add').dialog('close').form('reset');
$('#manager').datagrid('reload');
}else{
$.message.alert('新增失败！','未知错误导致失败，请重试！','warning');
}
}
});
}
},
},{
text:'取消',
iconCls:'icon-redo',
headler:function(){
$('manager_add').dialog('close').form('reset');
},
}];
});
$('#manager_edit').dialog({
width:350,
title:'修改管理',
modal:true,
closed:true,
iconCls:'icon-user-add',
buttons:[{
text:'提交',
iconCls:'icon-edit-new',
headler:function(){
},
},{
text:'取消',
iconCls:'icon-redo',
headler:function(){
$('manager_edit').dialog('close').form('reset');
},
}];
});
//账号管理：
$('input[name="manager"]').validatebox({
required:true,
validType:'length[2,20]',
missingMessage:'请输入管理名称',
invalidMessage:'管理名称在2-20位',
});
//管理密码：
$('input[name="password"]').validatebox({
required:true,
validType:'length[3,60]',
missingMessage:'请输入管理密码',
invalidMessage:'管理密码在6-30位',
});
//分配权限
$('#auth').tree({
url:"nav.php",
required:true,
lines:true,
multiple:true,
checkbox:true,
onlyLeafcheck:true,
onLoadSuccess:function(node,data){
var _this =this;
if(data){
$(data).each(function(index,value){
if(this.state == 'closed'){
$(_this).tree('expandAll');
}
});
}
},
});
manager_tool = {
add:function(){
$('#manager_add').dialog('open');
$('input[name="manager"]').focus();
},
edit:function(){
var rows = $('#manager').datagrid('getSelections');
if(rows.length > 1){
$.message.alert('警告操作！','编辑记录只能选定一条数据！','warning');
}else if(rows.length == 1){
$.ajax({
url:'getManager.php',
type:'post',
data:{
id: rows[0].id,
},
beforeSend:function(){
$.message.progress({
text:'正在获取中……',
});
},
success:function(data,response,status){
$.message.progress('close');
if(data>0){
var obj = $.parseJSON(data);
var auth = $boj[0].auth.split(',');
$('#manager_edit').from('load',{
id: obj[0].id,
manager_edit: obj[0].manager,
//auth_edit: obj[0].auth,
}).dialog('open');
//分配权限
$('#auth_edit').tree({
url:"nav.php",
required:true,
lines:true,
multiple:true,
checkbox:true,
onlyLeafcheck:true,
onLoadSuccess:function(node,data){
var _this =this;
if(data){
$(data).each(function(index,value){
if($.inArray(value.text,auth) != -1){
$(_this).tree('check',value.target);
}
if(this.state == 'closed'){
$(_this).tree('expandAll');
}
});
}
},
});
}else{
$.message.alert('获取失败！','未知错误导致失败，请重试！','warning');
}
}
});
}else if(rows.length == 0){
$.message.alert('警告操作！','编辑记录至少选定一条数据！','warning');
}
}
};
});
//getManager.php
<?php
require 'config.php';
$id = $_POST['id'];
$query = mysql_query("SELECT id,manager,auth FROM easyui_admin WHERE id='$id'") or die('SQL 错误！');
$total = mysql_num_rows(mysql_query("SELECT id,manager,auth,date FROM easyui_admin"));
$json = '';
while(!!$row = mysql_fetch_array($query,MYSQL_ASSOC)){
$json .= json_encode($row).',';
}
$json = substr($json,0,-1);
echo '{"total" : '.$total.',"rows" : ['.$json.']}';
mysql_close();
?>
作者：Roger_CoderLife
链接：https://blog.csdn.net/Roger_CoderLife/article/details/106096094
本文根据网易云课堂JQuery EasyUI视频教程翻译成文档，转载请注明原文出处，欢迎转载
类似资料：