产品经理：那个table排序能不能点击后弹个选项选择正序倒序不排序？

-- 那个是bootstrapTable的插件！不支持！改不了！！

注意：数据上假的，效果看http请求参数进行脑补

这是bootstrap能干的列排序：

客户想要的列排序：

点击再选择升序、降序、不排序，这种反人性的设计。。。。（bootstrapTable没分成上下俩箭头点击排序也很反人性，想倒序还要点击两次）

百度一下，网上并没有这种需求和方案，bootstrapTable也没有哪里可以拦截排序，去自定义创建dom再触发排序的api

所以，从bootstrapTable.js下手吧！

先了解下bootstrapTable是如何做列排序的

1、在initHeader函数里进行循环colums的时候通过判断options.sortable和column.sortable进行class标记是否排序字段

2、监听th点击事件，调用onSort函数

3、onSort排序事件（获取对应排序字段及排序方式）

改造！！！

1、改dom  （可排序列添加一个dropdown）

2、改事件监听（干掉原有的监听，添加新的事件监听）

3、复制一份onSort修改获取排序字段及排序方式的逻辑

4、css配合让dropdown正常显示（不该这么写th，，）

改造到此结束，至于有什么bug，也很难预料到。不便去深究

其实很不推荐修改bootstrapTable，这种第三方基础的东西很容易在不知情的情况下覆盖掉，

demo效果：在这里

github仓库地址：https://github.com/lvgao2012/bootstrap-table

【变态需求】bootstrapTable列排序-选择正序倒序不排序的更多相关文章

  1. Java：集合，对列表（List）中的自定义对象按属性（字段）排序（正序、倒序）的方法

    1. 要求 对列表(List)中的自定义对象,要求能够按照对象的属性(字段)进行排序(正序.倒序). 如:用户对象(Member)有用户名(username).级别(level).出生日期(birth ...

  2. C#数组的排序（正序逆序）

    C#数组的排序(正序逆序) 这种排序 超级简单的 ! using System; using System.Collections.Generic; using System.Linq; using ...

  3. Java：集合，对列表（List）中的数据（整型、字符串、日期等）进行排序（正序、倒序）的方法；字符串按照整型排序的方法

    1. 要求 对List列表中的数据进行排序(正序.倒序),列表中的数据包括:整型(Integer).字符串(String).日期(Date)等.对于字符串,要求允许对它按照整型进行排序. 2. 实现思 ...

  4. Comparable 接口学习：对对象List进行比较和排序（正序和逆序）

    Comparable 接口只有一个 int compareTo(T o) 方法 1.int compareTo(T o) 方法 方法说明: 比较此对象和规定的对象,如果此对象大于,等于,小于规定对象, ...

  5. java8笔记: sorted()之正序倒序

    java8笔记: sorted()之正序倒序 这篇文章将会讲解Java 8 Stream sorted()示例 下面代码以自然序排序一个list List<Person> listTem ...

  6. Java之选择排序（正序、逆序）

    public class SelectSort { public static void main(String[] args) { /** * @author JadeXu * @// TODO: ...

  7. 【java基础学习一】int[]、Integer[]、String[] 排序（ 正序、倒叙）、去重

    调用: //重复项有9.5.1.2 int[] ints = new int[]{9,4,7,8,2,5,1,6,2,5,9,1}; arrayIntTest(ints); ///////////// ...

  8. [javaSE] 数组（排序-选择排序）

    两层嵌套循环,外层循环控制次数,内层循环进行比较 for(int x=0;x<arr.length;x++){ for(int y=0;y<arr.length;y++){ if(arr[ ...

  9. 数据结构：堆排序 （python版） 小顶堆实现从大到小排序 | 大顶堆实现从小到大排序

    #!/usr/bin/env python # -*- coding:utf-8 -*- ''' Author: Minion-Xu 小堆序实现从大到小排序,大堆序实现从小到大排序 重点的地方:小堆序 ...

随机推荐

  1. [20171107]dbms_shared_pool.pin.txt

    [20171107]dbms_shared_pool.pin.txt --//昨天与别人聊天提到,如果dbms_shared_pool.pin对象,可以改变对应的chunk的类型.我自己也不确定,做一 ...

  2. 谷歌浏览器javascript错误提示插件

    JavaScript-Errors-Notifier_v2.1.7 下载地址 安装方法: http://chromecj.com/utilities/2014-09/181.html 设置方式:

  3. Git的gc功能

    http://blog.csdn.net/lihuanshuai/article/details/37345565 Git的底层并没有采用 CVS.SVN 底层所采用的那套增量式文件系统,而是采用一套 ...

  4. Android 电池系列

    android 电池(一):锂电池基本原理篇 android 电池(二):android关机充电流程.充电画面显示 android 电池(三):android电池系统 android电池(四):电池 ...

  5. Centos7防火墙快速开放端口配置方法

    ▲这篇文章主要为大家详细介绍了Centos7防火墙开放端口的快速方法,感兴趣的小伙伴们可以参考一下! Firewalld服务是红帽RHEL7系统中默认的防火墙管理工具,特点是拥有运行时配置与永久配置选 ...

  6. hadoop系列 第二坑： hive hbase关联表问题

    关键词: hive创建表卡住了 创建hive和hbase关联表卡住了 其实针对这一问题在info级别的日志下是看出哪里有问题的(为什么只能在debug下才能看见呢,不太理解开发者的想法). 以调试模式 ...

  7. centos7下安装docker（13.3volume生命周期管理）

    本章讨论:volume的备份,恢复,迁移和销毁 1.备份 通过前面的大量的实验,我们知道volume 是依赖host存在的,是host中的文件或目录,所以volume 的备份实际是对文件系统的备份. ...

  8. mocha测试框架-truffle

    https://mochajs.org/
学习网址:
https://www.jianshu.com/p/9c78548caffa
https://www.jb51.net/article/10646 ...

  9. Linux监控命令整理（top,free,vmstat,iostat,mpstat,sar,netstat）

    1.1 top 1.1.1 命令说明 Top 命令能够实时监控系统的运行状态,并且可以按照cpu.内存和执行时间进行排序 1.1.2 参数说明 命令行启动参数: 用法: top -hv | -bcis ...

  10. powerDesigner创建类及数据模型

    1.创建类图 / 2.创建类图的属性 3.创建一个类,这个是创建后的对应关系,可以给其他的地方引用 3.创建类时候的属性 name 和 code 取消关联 4.创建两个类的关系 这里有个科普知识(ht ...