前端代码
路径:application/index/view/user/index.html
{$title}{css href="__INDEX__/reset.css" /}
{css href="__INDEXCSS__/bootstrap.min.css" /}
{css href="__INDEXCSS__/toastr.min.css" /}
{js href="__INDEXJS__/jquery.min.js" /}
{js href="__INDEXJS__/bootstrap.min.js" /}
{js href="__INDEXJS__/toastr.min.js" / }
{$title}
添加用户
ID | 用户名 | 操作 |
---|
{volist name="list" key="k" id="v" mod="2"}
{eq name="mod" value="0"}
{$v['id']}{$v['name']}data-target="#myModal">查看信息框
data-target="#editModal">编辑
删除
{/eq}
{/volist}
ID | 用户名 | 操作 |
---|
{volist name="list" key="k" id="v" mod="2"}
{eq name="mod" value="1"}
{$v['id']}{$v['name']}data-target="#myModal">查看信息框
data-target="#editModal">编辑
删除
{/eq}
{/volist}
// 设置弹框参数
toastr.options = {
closeButton: true,// 是否显示关闭按钮
progressBar: false,// 实现显示计时条
timeOut: "2000", // 自动关闭时间
positionClass: "toast-top-right" // 提示位置
// toast-top-full-width 顶端,宽度铺满整个屏幕
// toast-top-right 顶端右边
};
$(function () {
//查询
$('.read-btn').click(function () {
var id = $(this).attr('id'); //获得当前点击的ID
console.log('当前点击的ID: ' + id);
readAJAX(id);
});
//添加
$('.add-btn').click(function () {
var input = $('#group input').val();
// console.log(input);
//判断input表单是否为空
if ($.trim(input) == '') {
alert('值不能为空');
return false;
}
var arr = $('#group input').serializeArray(); //将获取到数据转换数组
// console.log(arr);
addAJAX(arr);
});
//删除
$('.del-btn').click(function () {
var id = $(this).attr('id');//获取当前删除的id
console.log('当前点击ID:' + id);
if (confirm('您确定要[ 删 除 ]吗?')) {
var row = $(this).parents('tr');//获得当前行的所有信息
// console.log(row);
delAJAX(id, row);
}
});
//编辑
$('.edit-btn').click(function () {
var id = $(this).attr('id');
console.log('当前点击的ID:' + id);
editAJAX(id);
});
//保存编辑
$('.up-btn').click(function () {
var input = $('#upGroup input').val();
// console.log(input);
//判断input表单是否为空
if ($.trim(input) == '') {
alert('值不能为空');
return false;
}
var id = $('#eid').val();
var earr = $('#upGroup input').serializeArray(); //转换数组
// console.log(id, earr);
updAJAX(id, earr)
});
});
//保存编辑
function updAJAX(id, array) {
$.ajax({
type: 'post',
url: '/update/' + id,
dataType: 'json',
data: array,
success: function (data) {
console.log(data);
if (data.status) {
toastr.success(data.info);
$('.gb-btn').click();
setTimeout(function(){
window.location.reload();//刷新当前页面.
},2000)
} else {
toastr.error(data.info);
}
},
error: function () {
alert('重复值,请重试');
}
});
}
//查看编辑信息
function editAJAX(id) {
$.ajax({
type: 'get',
url: '/edit/' + id,
dataType: 'json',
success: function (data) {
console.log(data);
if (data.status) {
$('#eid').val(data.info.id);
$('#enames').val(data.info.name);
} else {
$('#enames').val(data.info);
}
},
error: function () {
alert('失败');
}
});
}
//删除
function delAJAX(id, row) {
$.ajax({
type: 'get',
url: '/del/' + id,
dataType: 'json',
success: function (data) {
console.log(data);
if (data.status) {
toastr.success(data.info);
row.remove('tr');
} else {
toastr.error(data.info);
}
},
error: function () {
alert('失败');
}
});
}
//添加信息
function addAJAX(array) {
$.ajax({
type: 'post',
url: '/add/',
data: array,
dataType: 'json',
success: function (data) {
console.log(data);
if (data.status) {
toastr.success(data.info);
$('.gb-btn').click();
setTimeout(function(){
window.location.reload();//刷新当前页面.
},2000)
} else {
toastr.error(data.info);
}
},
error: function (data) {
alert('重复添加');
}
});
}
//查看详情
function readAJAX(id) {
$.ajax({
type: 'get',
url: '/read/' + id,
dataType: 'json',
success: function (data) {
console.log(data);
if (data.status) {
$('#myModaltitle').html(data.title);
$('#myModalbody').html(data.body.name);
} else {
$('#myModaltitle').html(data.title);
$('#myModalbody').html(data.body);
}
},
error: function () {
alert('失败');
}
});
}
定义页面访问路由地址
路径:application/route.php
use think\Route;
// +----------------------------------------------------------------------
// | ThinkPHP [ WE CAN DO IT JUST THINK ]
// +----------------------------------------------------------------------
// | Copyright (c) 2006~2018 http://thinkphp.cn All rights reserved.
// +----------------------------------------------------------------------
// | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
// +----------------------------------------------------------------------
// | Author: liu21st
// +----------------------------------------------------------------------
//tp首页
Route::get('/','index/index/index');//前台首页
//用户列表
Route::get('user','index/user/index');//列表首页
Route::get('read/:id','index/user/read');//查看用户详情
Route::post('add','index/user/add');//添加用户
Route::get('del/:id','index/user/del');//删除用户
Route::get('edit/:id','index/user/edit');//编辑用户
Route::post('update/:id','index/user/update');//保存编辑
后端php
路径:application/index/controller/User.php
/**
* Created by PhpStorm.
* User: 14280
* Date: 2019/8/22
* Time: 15:44
*/
namespace app\index\controller;
use think\Controller;
use think\Db;
use think\Request;
class User extends Controller
{
//主页
public function index()
{
$res = Db::table('hc_user')->field(['id', 'name'])->order(['id' => 'ASC'])->select();
// var_dump($res);die();
return view('user/index', [
'title' => '用户列表',
'list' => $res
]);
}
//查看详情
public function read($id)
{
$res = Db::table('hc_user')->field(['pass','status'],true)->find($id);
// var_dump($res);die();
if ($res === null){
$info['status'] = false;
$info['title'] = '无此信息';
$info['body'] = '无此人信息,请重试';
}else{
$info['status'] = true;
$info['title'] = $res['name'];
$info['body'] = $res;
}
return json($info);
}
//添加用户
public function add(Request $request)
{
$post = $request->post();
// var_dump($post);die();
$list = [
'name' => $post['name']
];
// var_dump($list);
$res = Db::table('hc_user')->insert($list);
// var_dump($res);
if ($res > 0 ){
$info['status'] = true;
$info['info'] = '添加成功';
} else {
$info['status'] = false;
$info['info'] = '添加失败,请重试';
}
return json($info);
}
public function del($id)
{
$res = Db::table('hc_user')->delete($id);
if($res){
$info['status'] = true;
$info['info'] = '删除成功';
}else{
$info['status'] = false;
$info['info'] = '删除成功';
}
return json($info);
}
//查看编辑
public function edit($id)
{
$res = Db::table('hc_user')->field(['pass','status'],true)->find($id);
// var_dump($res);
if ($res === null){
$info['status'] = false;
$info['info'] = '无此信息';
}else{
$info['status'] = true;
$info['info'] = $res;
}
return json($info);
}
public function update(Request $request,$id)
{
$post = $request->post();
// var_dump($post);
$res = Db::table('hc_user')->where(['id'=>$id])->update($post);
if ($res){
$info['status'] = true;
$info['info'] = '修改成功';
}else{
$info['status'] = false;
$info['info'] = '修改失败';
}
return json($info);
}
}