thinkphp5ajax分页搜索删除即点即改

最新推荐文章于 2021-08-06 00:11:54 发布

桃九

最新推荐文章于 2021-08-06 00:11:54 发布

阅读量261

点赞数

分类专栏： tp3ajax分页删除修改文章标签： tp5ajax分页删除修改

本文链接：https://blog.csdn.net/chabao111111/article/details/89440087

版权

tp3ajax分页删除修改专栏收录该内容

1 篇文章 0 订阅

订阅专栏

//添加页面

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<center>
    <form action="__URL__/show" method="post">
        <table border="1" bgcolor="#faebd7" bordercolor="purple">
            <tr>
                <td>商品名称</td>
                <td><input type="text" id="name" name="name"></td>
            </tr>
            <tr>
                <td>用户密码</td>
                <td><input type="text" id="pwd" name="pwd"></td>
            </tr>
            <tr>
                <td></td>
                <td><input type="submit" value="添加"></td>
            </tr>
        </table>
    </form>
</center>
</body>
</html>

//index控制器 //添加分页删除修改

<?php
namespace app\index\controller;
use think\Controller;
use think\Db;
use think\Request;

class Index extends Controller
{
    public function index()
    {
        return view();
    }
    public function login()
    {
        $data = Request::instance()->param();//接收值
        $res = model('user')->insert($data);//实例化 模型层model 表名studen
        if($res){ //判断是否添加
            $this->error('添加成功');//添加成功
        }
        $this->success('添加失败');//添加失败
    }
    public function show()
    {
        //获取要搜索的值
        $sou = input('sou');
        //嵌套上搜索的内容查询数据，搜索有内容显示内容，没有内容正常显示所有数据
        $data = Db::table('user')->where("name",'like',"%$sou%")->paginate(6);
        $page = $data->render();
        if(Request::instance()->isAjax()){
            return array(
                'data' => $data,
                'page' => $page,
            );
        }
        $this->assign('data',$data);
        $this->assign('page',$page);
        return view();
    }
    public function del(){
        $data['id']=Request::instance()->param('id');
//        $data = input('id');
        $re=model('user')->dels($data);
        $data = Db::table('user')->paginate(6);
        return $data;
    }
    //即点即改
    public function save()
    {
        $id = input('get.id');
        $data['name'] = input('get.str');
        $res = Db::name("user")->where("id",'=',$id)->update($data);
        if($res)
        {
            return 1;
        }
        else
        {
            return 2;
        }
    }
}

model层 usermodel

<?php
namespace app\index\model;
use think\Model;

class User extends Model
{
    public function add_one($data){
        return $this->insert($data);
    }
    public function dels($id){
        return $this->where($id)->delete($id);
    }
}

show 展示页面分页搜索删除即点即改

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>分页</title>
</head>
<style>
    table{
        width: 1000px;
        text-align: center;
        background: pink;
    }
    tr{
        background: white;
    }
    .pagination li{
        float: left;
        list-style-type: none;
        margin: 3px;
        margin-left:10px;
        padding-left: 100px;
    }
</style>
<body>
<form action="__URL__/show" method="post">
    <input type="text" name="sou"/><input type="submit" value="搜索"/>
</form>
<table>
    <tr>
        <td>id</td>
        <td>用户名</td>
        <td>密码</td>
        <td>性别</td>
        <td>年龄</td>
        <td>操作</td>
    </tr>
    <tbody id="body">
    {foreach name="data" item="vo"}
    <tr class="trs" t_id="{$vo.id}">
        <td>{$vo.id}</td>
        <td><span class="admin">{$vo.name}</span><input type="text" value="{$vo.name}" style="display: none" class="gai"/></td>
        <td>{$vo.pwd}</td>
        <td>{$vo.sex}</td>
        <td>{$vo.age}</td>
        <td><input type="button" value="删除" class="del" d_id="{$vo.id}"></td>
    </tr>
    {/foreach}
    </tbody>
</table>
<div id="page">{$page}</div>
</body>
</html>
<script src="__STATIC__/jquery-3.3.1.min.js"></script>
<script>
        //分页
    $(document).on('click','.pagination li a',function(){
        page=$(this).attr('href');
        event.preventDefault();
        $.ajax({
            method:"GET",
            url:page,
            success:function(res){
                str='';
                $.each(res.data.data,function(k,v){
                    str+='<tr>';
                        str+='<td>'+v.id+'</td>';
                        str+='<td>'+v.name+'</td>';
                        str+='<td>'+v.pwd+'</td>';
                        str+='<td>'+v.sex+'</td>';
                        str+='<td>'+v.age+'</td>';
                    str+='<td><input type="button" value="删除" class="del" d_id="'+v.id+'"></td>';
                    str+='</tr>';
                });
                $("#body").html(str);
                $("#page").html(res.page);
            }
        })
    });
    $(document).on('click','.del',function(){
        var id=$(this).attr('d_id');
        page=$(".active span").text();
        $.ajax({
            url:'__URL__/del',
            type:'post',
            dataType:'json',
            data:{
                id:id,
                page:page
            },
            success:function(arr){
                str='';
                $.each(arr.data,function(k,v){
                    str+='<tr>';
                    str+='<td>'+v.id+'</td>';
                    str+='<td>'+v.name+'</td>';
                    str+='<td>'+v.pwd+'</td>';
                    str+='<td>'+v.sex+'</td>';
                    str+='<td>'+v.age+'</td>';
                    str+='<td><input type="button" value="删除" class="del" d_id="'+v.id+'"></td>';
                    str+='</tr>';
                });
                $("#body").html(str);
            }
        })
    });
        //即点即改
        $(function() {
            $(document).on('click','span',function(){
                $(this).hide();
                $(this).next().show();
            });
            $(document).on('blur','.gai',function(){
                obj = $(this);
                str = obj.val();
                id = obj.parents('tr').attr('t_id');
                alert(id);
                $.ajax({
                    type:'get',
                    url:"{:url('index/save')}",
                    data:{id:id,str:str},
                    datatype:'json',
                    success:function(e)
                    {
                        if(e==1)
                        {
                            alert("修改成功");
                            obj.hide();
                            obj.prev().show().html(str);
                        }
                        else
                        {
                            alert("修改失败");
                        }
                    }
                })
            })

        })
</script>