php首页修改jquery框架,JQuery_Ajax增删改实例二 (TP5框架之RESTful资源路由)

前端代码

路径:application/restful/view/users/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}

×

...

关闭

aria-hidden="true">×

用户添加

姓名:

关闭

确认添加

aria-hidden="true">×

用户修改

姓名:

关闭

确认修改

// 设置弹框参数

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);

saveAJAX(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: '/users/' + 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: '/users/' + id,

dataType: 'json',

success: function (data) {

console.log(data);

if (data.status) {

$('#eid').val(data.body.id);

$('#enames').val(data.body.name);

} else {

$('#enames').val(data.body);

}

},

error: function () {

alert('失败');

}

});

}

//删除

function delAJAX(id, row) {

$.ajax({

type: 'delete',

url: '/users/' + 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 saveAJAX(array) {

$.ajax({

type: 'post',

url: '/users/',

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: '/users/' + 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::resource('users','restful/users');

后端php

路径:application/restful/controller/Users.php

namespace app\restful\controller;

use think\Controller;

use think\Request;

use think\Db;

class Users extends Controller

{

/**

* 显示资源列表

*

* @return \think\Response

*/

public function index()

{

$res = Db::table('hc_user')->field(['id', 'name'])->order(['id' => 'DESC'])->select();

// var_dump($res);die();

return view('users/index', [

'title' => '用户列表',

'list' => $res

]);

}

/**

* 显示创建资源表单页.

*

* @return \think\Response

*/

public function create()

{

//

}

/**

* 保存新建的资源

*

* @param \think\Request $request

* @return \think\Response

*/

public function save(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);

}

/**

* 显示指定的资源

*

* @param int $id

* @return \think\Response

*/

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);

}

/**

* 显示编辑资源表单页.

*

* @param int $id

* @return \think\Response

*/

public function edit($id)

{

}

/**

* 保存更新的资源

*

* @param \think\Request $request

* @param int $id

* @return \think\Response

*/

public function update(Request $request, $id)

{

// var_dump($request);die();

$post = $request->post();

// var_dump($post);

// die();

$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);

}

/**

* 删除指定资源

*

* @param int $id

* @return \think\Response

*/

public function delete($id)

{

$res = Db::table('hc_user')->delete($id);

if($res){

$info['status'] = true;

$info['info'] = '删除成功';

}else{

$info['status'] = false;

$info['info'] = '删除成功';

}

return json($info);

}

}