html中的代码

<table id="table"></table>

sortData.json的数据如下

[
{"name":"三洋","num":"10","pecent":"29%"},
{"name":"松下","num":"9","pecent":"28%"},
{"name":"美的","num":"7","pecent":"20%"},
{"name":"小天鹅","num":"3","pecent":"8%"},
{"name":"飞利浦","num":"12","pecent":"32%"}
]

对应的js代码

 $("#table").bootstrapTable({
dataType: "json",
method: 'get',
contentType: "application/x-www-form-urlencoded",
cache: false,
url:"data/sortData.json",
columns:[
{
field: 'name',
title: '品牌名称',
valign:"middle",
align:"center",
sortable:true
},
{
field: 'num',
title: '门店数量',
valign:"middle",
align:"center",
sortable:true,
sorter:numSort
},{
field: 'pecent',
title: '市场份额',
valign:"middle",
align:"center",
sortable:true,
sorter:percentSort
}
]
})
function numSort(a, b) {
return b-a;
}
function percentSort(a, b) {
var value_a = a.substr(0, a.length-1)
var value_b = b.substr(0, b.length-1)
return value_b-value_a;
}
对于数值类型的数据使用numSort排序
对于有百分号的数据使用percentSort
bootstrap-table默认按字符串排序

默认显示的结果

数值类型排序的结果

正序排序

倒序排序

百分比类型数据排序的结果

正序排序

倒序排序

												

bootstrap-table不分页时对数值类型数据的排序的更多相关文章

  1. bootstrap table 服务器端分页例子分享

    这篇文章主要介绍了bootstrap table 服务器端分页例子分享,需要的朋友可以参考下 1,前台引入所需的js 可以从官网上下载 复制代码代码如下: function getTab(){var ...

  2. 161222、Bootstrap table 服务器端分页示例

    bootstrap版本 为 3.X bootstrap-table.min.css bootstrap-table-zh-CN.min.js bootstrap-table.min.js 前端boot ...

  3. [前端插件]Bootstrap Table服务器分页与在线编辑应用总结

    先看Bootstrap Table应用效果: 表格用来显示数据库中的数据,数据通过AJAX从服务器加载,同时分页功能有服务器实现,避免客户端分页,在加载大量数据时造成的用户体验不好.还可以设置查询数据 ...

  4. C# Bootstrap table之 分页

    效果如图: 一.声明talbe <div class="container"> <table id="table" class="t ...

  5. [转]C# Bootstrap table之 分页

    本文转自:https://www.cnblogs.com/zhangjd/p/7895453.html 效果如图: 一.声明talbe <div class="container&qu ...

  6. [转]Bootstrap table后端分页(ssm版)

    原文地址:https://www.cnblogs.com/flyins/p/6752285.html 说明bootstrap table可以前端分页,也可以后端sql用limit分页.这里讲的是后端分 ...

  7. Bootstrap table后端分页(ssm版)

    说明bootstrap table可以前端分页,也可以后端sql用limit分页.这里讲的是后端分页,即实用limit.性能较好,一般均用这种源码下载地址:https://git.oschina.ne ...

  8. Bootstrap table前端分页(ssm版)

    说明bootstrap table可以前端分页,也可以后端sql用limit分页.前端分页下性能和意义都不大,故一般情况下不用这种,请看我的另一篇后端分页的博客源码下载地址:https://git.o ...

  9. bootstrap table 服务器端分页--ashx+ajax

    1.准备静态页面 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-T ...

随机推荐

  1. mvc4 Forms验证存储 两种登录代码

    自己也不知道网上看到的第一种居多,第二种用到的人很少,第二种代码十分简洁,就是不清楚是否有安全隐患. 要采用Forms身份验证,先要在应用程序根目录中的Web.config中做相应的设置: <a ...

  2. 1034 Head of a Gang (30 分)(图的遍历or并查集)

    dfs #include<bits/stdc++.h> using namespace std; ; int mp[N][N]; int weight[N]; int vis[N]; ma ...

  3. abs项目 - 战线拉的太长

    abs项目 - 战线拉的太长 “从项目中来,到项目中去”. 坑是踩不完的,尽量做到不要踩重复的坑就好. 最近的这个项目,从2016的8月份左右开始立项,一直做到2017的2月份,还是有很多的问题在继续 ...

  4. 基于语音转录的ted演讲推荐

    论文地址:https://arxiv.org/abs/1809.05350v1 二.  实现 我们从Kaggle[6]中获取了TED演讲数据集,其中包括2400个TED演讲的数据,包括标题.演讲者.标 ...

  5. nodeJs 调试异步程序追踪异步报错

    DeprecationWarning: Calling an asynchronous function without callback is deprecated. 翻译: 不建议在不回调的情况下 ...

  6. BZOJ 4012 HNOI2015 开店 树的边分治+分治树

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=4012 题意概述:给出一颗N点的树,保证树上所有点的度不超过3,树上每个点有权值,每条边有权 ...

  7. WebStorm中配置ExtJS

    原文链接:http://zhidao.baidu.com/link?url=yX0wDWrL-b2P8k3JNNI38Fb6keuAgm0j9E-QBL1KfWXrZgLZ88grAOVJvat6dJ ...

  8. Xcode 6.0中彻底关闭ARC

    对整个项目关闭ARCproject -> Build settings -> Apple LLVM complier 3.0 - Language -> objective-C Au ...

  9. ASP.NET页面之间传值QueryString(1)

    QueryString是一种非常简单的传值方式,他可以将传送的值显示在浏览器的地址栏中.如果是传递一个或多个安全性要求不高或是结构简单的数值时,可以使用这个方法.但是对于传递数组或对象的话,就不能用这 ...

  10. Codeforces Round #268 (Div. 1) 468D Tree(杜教题+树的重心+线段树+set)

    题目大意 给出一棵树,边上有权值,要求给出一个1到n的排列p,使得sigma d(i, pi)最大,且p的字典序尽量小. d(u, v)为树上两点u和v的距离 题解:一开始没看出来p需要每个数都不同, ...