首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >tp3.2.3实现支持点击排序

tp3.2.3实现支持点击排序

作者头像
lestat
发布于 2018-04-17 09:19:58
发布于 2018-04-17 09:19:58
1.2K00
代码可运行
举报
文章被收录于专栏:lestat's bloglestat's blog
运行总次数:0
代码可运行

假设:

Admin/Home/Controller/BaseController.class.php是一个基础控制器

$current_params$in是两个在Admin/Home/Controller/BaseController.class.php中用来保存接收参数的属性,并且已经在构造函数中对其赋值

Admin/Tpl/Index/footer.html是布局中的公共部分

Public/Model/BaseModel.class.php是公共模型

请求中用来表示模块,控制器,操作的参数名称分别为:m,c,a

#searchForm#excelForm分别为条件搜索form和excel表单导出请求提交时用来临时保存和传递筛选条件的form

全局改动

Admin/Home/Controller/BaseController.class.php改动:

新增protected $current_params属性 _initialize方法尾部新增以下代码(用于处理传入的有效参数):

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
unset($this->current_params['m']);
unset($this->current_params['c']);
unset($this->current_params['a']);
$this->assign('page_url', U(CONTROLLER_NAME.'/'.ACTION_NAME,$this->current_params));

控制器尾部新增以下方法:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
/*
 * todo:处理排序请求
 * @param $sort string 用来mysql排序的字符串
 * @param $column string 用来指定排序字段名称
 * @param $value int 排序值,1:顺序;2:倒序
 * @param $table string 需要排序字段在当前sql语句中表的别名
 * @return string 返回处理后的$order
 * */
protected function assembleSort($sort,$column,$value,$table){
    $order = urldecode($sort);
    $v_sort[$column] = $value == 1 ? 2 : 1;
    $v_sort['param_sort'] = $sort;
    $v_sort['param_column'] = $column;
    $v_sort['param_value'] = $v_sort[$column];
    $v_sort['param_table'] = $table;
    $this->assign('sort', $v_sort);
    return $order;
}

Admin/Tpl/Index/footer.html改动:

</body>标签前新增以下代码: html(保存当前页面并携带除排序相关参数的url):

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<input type="hidden" id="page_url" value="{{$page_url}}">

js:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
/*
    * todo:全局监听并处理点击排序操作
    * */
    $(function(){
        var form = $('#searchForm');
        if(typeof(form) !== 'undefined'){
            form.append("<input class='excel' type='hidden' name='sort' value='{{$sort.param_sort}}'/><input class='excel' type='hidden' name='column' value='{{$sort.param_column}}'/><input class='excel' type='hidden' name='value' value='{{$sort.param_value}}'/><input class='excel' type='hidden' name='table' value='{{$sort.param_table}}'/>");
        }
        $('th[data-sort=1]').attr('class','sortable').append('?');
        $('th[data-sort=2]').attr('class','sortable').append('?');
        $('tr').delegate('th','click',function(){
            var sort = $(this).attr('data-sort');
            var param = ``;
            if(typeof(sort) !== 'undefined'){
                var order = ``;
                var column = $(this).attr('data-column');
                var table = $(this).attr('data-table') ? $(this).attr('data-table') + '.' : '';
                if(sort == 1){
                    order = 'asc'
                }else if(sort == 2){
                    order = 'desc';
                }
                param = `${table}${column} ${order}`;
                var url = $('#page_url').val() + '&sort=' + param + '&column=' + column + '&value=' + sort + '&table=' + table;
                location.href = url;
            }
        });
    });
    /*
    * todo:处理导出excel操作
    * */
    if(typeof($('#excel')) !== 'undefined'){
        $('#excel').click(function () {
            ui.confirm('确定导出吗', function () {
                var eform = $('#excelform');
                if ($('#data').find('tr').length < 2) {
                    ui.error('没有可以导出的数据');
                    return false;
                }
                eform.html($('.excel').clone());
                eform.submit();
            });
        });
    }

Public/Model/BaseModel.class.php改动:

修改getPagegetExcel方法如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
/**
 * todo:获取列表记录并返回分页数据
 * @param $map array 筛选条件
 * @param $order string 排序规则
 */
public function getPage($map, $order = '')
{
    $count = $this->where($map)->count();
    $page = classPage($count);
    $row['info'] = $this->where($map)->order($order)->limit($page->firstRow, $page->listRows)->select();
    $row['page'] = $page->show();
    return $row;
}

/**
 * todo:获取导出到excel的数据集合
 * @param $map array 筛选条件
 * @param $order string 排序规则
 */
public function getExcel($map,$order = '')
{
    $data = $this->where($map)->order($order)->select();
    return $data;
}

Admin/root/static/css/shop_manager.css改动:

在尾部新增(用于控制可点击th样式):

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
.sortable{
    cursor: pointer;
    color:orangered;
}

局部改动

controlle

在相关controller中的列表方法(通常是index)中,新增一行:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$order = $this->assembleSort($this->in['sort'], $this->in['column'], $this->in['value'], $this->in['table']);

并将之前

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$data = $model->getPage($where);

改为:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$data = $model->getPage($where, $order);

在相关控制器中的导出到excel方法(通常是excel)中,做上述相同处理

view

在相关view中,修改需要排序的字段的th标签如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<th width="180px" data-sort="{{$sort.create_time|default=1}}" data-column="create_time" data-table="A">添加时间</th>

参数备注:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<th width="180px" data-sort="{{$sort.需要排序的字段名称|default=默认值1:当前为倒序,2:当前为顺序}}" data-column="需要排序的字段名称" data-table="如果当前列表需要通过join查询,此处为该字段所属的表别名">添加时间</th>

其它备注:

如果当前页面需要接收参数,如:配送点下面的配送元员列表,则需要在#searchForm的form中新增一个input标签:<input type="hidden" class="excel" name="point_id(参数名称)" value="(参数值)">

在所有重写了BaseModel的getPage或getExcel方法的模型中都需要做相应修改

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2017-09-14,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
BootstrapTable的列排序怎么搞
先搞一个table,使用ajax将数据查询出来,然后可以在所有列都加上排序。满足自己的需求。
别先生
2019/06/03
5K0
Laravel 5 系列入门教程(二)【最适合中国人的 Laravel 教程】
我们将改变学习路线,不再像 Laravel 4 教程那样先构建登录系统。在本篇教程中,我们将一起构建 Pages 的管理功能,尝试 Laravel 的路由和 PHP 的命名空间。
竹清
2018/08/31
1.1K0
Laravel 5 系列入门教程(二)【最适合中国人的 Laravel 教程】
Bootstrap Bootstrap表格插件bootstrap-table配置与应用小结
https://gitee.com/ishouke/front_end_plugin/blob/master/jquery-3.2.1.min.js
授客
2019/09/10
13.7K0
Bootstrap Bootstrap表格插件bootstrap-table配置与应用小结
从零开始做网站9-Springboot+vue简单的增删改查功能
因为很久没写过vue了,而且3.0还是第一回接触,所以一边学习一边做,进度还是稍慢的
sunonzj
2022/06/21
1.3K0
从零开始做网站9-Springboot+vue简单的增删改查功能
【第五篇】商城系统-商品属性管理
SPU是商品信息聚合的最小单位,是一组可复用、易检索的标准化信息的集合,该集合描述了一个产品的特性。通俗点讲,属性值、特性相同的商品就可以称为一个SPU。
用户4919348
2022/09/16
9200
【第五篇】商城系统-商品属性管理
python测试开发django-185.bootstrap-table 后端搜索功能实现(queryParams)
bootstrap-table 分页方式可以选 server 和client 两种分页方式。
上海-悠悠
2022/01/10
8300
python测试开发django-185.bootstrap-table 后端搜索功能实现(queryParams)
【愚公系列】2023年02月 WMS智能仓储系统-018.收获管理和发货管理(完结篇)
4.待分拣:收货管理员需要严格按照收货质量标准进行管理,以确保货物的质量,并进行分类;
愚公搬代码
2023/03/16
5020
【愚公系列】2023年02月 WMS智能仓储系统-018.收获管理和发货管理(完结篇)
[PHP] 商品类型规格属性后台管理(代码流程备忘)
涉及到四张表,type(商品类型表),type_spec(商品类型规格关联表),attribute(商品属性表),attribute_value(商品属性值表)
唯一Chat
2019/09/10
9140
[PHP] 商品类型规格属性后台管理(代码流程备忘)
常见的数据列表查询:同时支持置顶、锁定位置、移动排序、分页的实现逻辑
逻辑: 假设每页50条数据,查出当页的lock值的数据,比如第一页就是lock为1-50的,第二页就是lock为51-100的,同时查出前面几页所有的lock数据的数量,这个数量就是当前页需要往前偏移的offset,根据这个offset获取的列表,进行当前页有lock的进行替换。这样满足任意一页的数据。
躺平程序员老修
2023/09/05
5320
常见的数据列表查询:同时支持置顶、锁定位置、移动排序、分页的实现逻辑
ASP.NET MVC5+EF6+EasyUI 后台管理系统(73)-微信公众平台开发-消息管理
前言 回顾上一节,我们熟悉的了解了消息的请求和响应,这一节我们来建立数据库的表,表的设计蛮复杂 你也可以按自己所分析的情形结构来建表 必须非常熟悉表的结果才能运用这张表,这表表的情形涵盖比较多
用户1149182
2018/01/16
2.1K0
ASP.NET MVC5+EF6+EasyUI 后台管理系统(73)-微信公众平台开发-消息管理
EasyUI使用笔记——Datagrid的使用及排序
Datagrid的使用: 添加一个table,其中class设置为easyui-datagrid,在data-options中设置datagrid的参数,我这里是这样写的:
徐大嘴
2019/03/21
1.6K0
Springboot+Mybatis自动生成CRUD+html
现在除了idea自带生成实体类,搭配lombook可免生成get.set,Mybatis逆向工程生成crud外,还可指定读取表名生成表格管理页面。
疯狂的KK
2019/12/31
8890
SaaS-用户管理
用户其实就是saas企业访问的员工,对企业员工完成基本的CRUD操作 表结构如下:
cwl_java
2020/01/02
1K0
自用插件整理之表格bootstrap-table
本插件基于bootstrap,网上各种例子也比较多,本文就不详细列api一类的了,只将自己常用的记录一下。多数代码中存在的注释,就不再重写。
WindCoder
2018/09/20
3.2K0
自用插件整理之表格bootstrap-table
第13章 Kotlin 集成 SpringBoot 服务端开发(2)
其中,ON DUPLICATE KEY UPDATE 这句表明当遇到重复的键值的时候,执行更新 gmt_modified = now() 的操作。这里nativeQuery = true ,表示使用的是原生 SQL 查询。
一个会写诗的程序员
2018/08/17
5930
第13章 Kotlin 集成 SpringBoot 服务端开发(2)
【愚公系列】2023年02月 WMS智能仓储系统-016.库存管理和仓内作业(库存管理、仓内加工、库存移动)
文章目录 前言 一、库存管理 1.1 页面代码 1.2 接口代码 二、仓内作业 1.仓内加工 1.1 页面代码 1.2 接口代码 2.库存移动 2.1 页面代码 2.2 接口代码 ---- 前言 这节主要分为两个模块: 库存管理:库存管理的作用是确保有足够的库存量以满足消费者需求,减少库存空置和库存损耗,并有效地控制库存成本。 仓内作业:仓内作业的作用是帮助仓库提高组织效率和完成仓库管理。它提高了仓库存储条件、运输条件和信息系统的效率,并节省了人力成本。 一、库存管理 库存管理数据主要
愚公搬代码
2023/03/16
7910
【愚公系列】2023年02月 WMS智能仓储系统-016.库存管理和仓内作业(库存管理、仓内加工、库存移动)
ASP.NET MVC5+EF6+EasyUI 后台管理系统(22)-权限管理系统-模块导航制作
最近比较忙,系统难度独步增加,文章的发布速度明显比以前慢了。 由于我们已经跑通了整个系统,所有东西都回到了简单,接下来我们做模块制作也就是操作SysModule表。 首先我们来回顾一下之前的难点主要就是SysRight这个表Rightflag字段的改变,这个字段关系导航与角色组的关系显示(即有权限时候显示菜单导航,这个更新讲到授权讲到,在这里浮头一下) 所以我们操作SysModule必须更新SysRight这张表,把模块先分配给角色 所以思路已经比较明显和简单了,这里我们模块将用treegrid来做,同时也
用户1149182
2018/01/16
5.3K0
ASP.NET MVC5+EF6+EasyUI 后台管理系统(22)-权限管理系统-模块导航制作
Vue + Element UI 实现权限管理系统 前端篇(十二)
 而具体的Mock接口,把根路径移除,因为在生成Mock的时候会自动把根路径加上去。
朝雨忆轻尘
2019/06/18
1.4K0
ThinkPHP 3.2.3 简单后台模块开发(二)RBAC
RBAC(Role-Based Access Controll)基于角色的访问控制
botkenni
2022/01/10
2.1K0
ThinkPHP 3.2.3 简单后台模块开发(二)RBAC
fasadmin导出数(利用PhpSpreadsheet和自制模板的服务端导出到Excel方法)
1.以fastadmin自带的test表为例; 2.所有操作都是针对test做了CURD后形成的文件view之test.html、控制器test.php、test.js文件修改。
超级小可爱
2023/12/21
6530
fasadmin导出数(利用PhpSpreadsheet和自制模板的服务端导出到Excel方法)
推荐阅读
相关推荐
BootstrapTable的列排序怎么搞
更多 >
LV.1
这个人很懒,什么都没有留下~
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档