bootstrap-table前端修改数据
使用bootstrap-table显示数据,后台传回数据以后,可能需要对其做调整,如需要前端为数据添加单位
调整数据代码
$("#"+tableId).bootstrapTable({
dataType: "json",
method: 'get',
contentType: "application/x-www-form-urlencoded",
cache: false,
url:url,
sortName:sortName, //排序列名
sortOrder: sortOrder,//排位命令(desc,asc)
queryParams: queryParams,
columns:columns,
pagination:true,
sidePagination:'server',
pageNumber:1,
pageSize:10,
pageList:[10],
onLoadSuccess:function(data){
//通过对data判断
if("rate" in data["rows"][0]){
var result = data["rows"];
$.each(result,function(index,content){
content["rate"] =content["rate"]+"%";ze5year"] =content["authorize5year"]+"%";
})
$("#"+tableId).bootstrapTable("load",data)
}
},
代码的解释
数据通过onLoadSuccess返回,此时数据已经渲染到页面中,这里将返回的数据对应的列中加上相应的单位(“%”)之后,使用
$("#"+tableId).bootstrapTable("load",data)重新加载到表格中,数据即得以改变
bootstrap-table前端修改数据的更多相关文章
- 【转】bootstrap table轻松实现数据表格
在使用bootstrap table时可能在很多时候回用的表格来显示数据,如果自己写那肯定没问题,但是数据展示出来就麻烦多了,然而bootstrap table 封装了一套完善的数据表格组件,把从后台 ...
- Bootstrap table前端分页(ssm版)
说明bootstrap table可以前端分页,也可以后端sql用limit分页.前端分页下性能和意义都不大,故一般情况下不用这种,请看我的另一篇后端分页的博客源码下载地址:https://git.o ...
- bootstrap table 前端搜索
1.bootstrap-table对于前端的搜索可以通过官网设置,但发现前端搜索出现bug,网上找到一个bootstrap-table的扩充js bootstrap-table-mytoolbar. ...
- MVC bootstrap 实现 bootstrap table 左右传递数据
源码: @{ ViewBag.Title = "Index"; } @using BC.Platform.UPMS.Models; <!DOCTYPE html> &l ...
- bootstrap table加载数据
//html <table id="dailyDevTable"></table> //js $(function () { initTable(); }) ...
- bootstrap table通过ajax获取后台数据展示在table
1. 背景 bootstrap table 默认向后台发送语法的dataType为 json,但是为了解决跨域问题我们需要将dataType改为jsonp,这时就需要修改bootstrap table ...
- bootstrap table 的searchParam参数传递
bootstrap table 的searchParam自定义参数传递 Bootstrap Table返回的数据为value 和 rows Long total代表的是多少条(总数) List< ...
- [前端插件]Bootstrap Table服务器分页与在线编辑应用总结
先看Bootstrap Table应用效果: 表格用来显示数据库中的数据,数据通过AJAX从服务器加载,同时分页功能有服务器实现,避免客户端分页,在加载大量数据时造成的用户体验不好.还可以设置查询数据 ...
- bootstrap table 获取数据后的前台页面(后台怎么传就不必详细说明了吧)
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ t ...
随机推荐
- POJ3259(Wormholes) 判断负环
题意: 农夫john发现了一些虫洞,虫洞是一种在你到达虫洞之前把你送回目的地的一种方式,FJ的每个农场,由n块土地(编号为1-n),M 条路,和W个 虫洞组成,FJ想从一块土地开始,经过若干条路和虫洞 ...
- day5 continue 和 break的区别
# continue num = 1 while num <=10: num += 1 if num == 3: continue print(num) # continue 表示跳出本次循环后 ...
- Android学习系列(17)--App列表之圆角ListView(续)
http://www.cnblogs.com/qianxudetianxia/archive/2011/09/19/2068760.html 本来这篇文章想并到上篇Android学习系列(16)- ...
- 树莓派使用iperf3测量网络带宽
这个工具需要两台设备都安装iperf3工具,一台作为服务端,一台作为客户端.客户端通过链接服务端测量吞吐量. 安装iperf3 sudo apt install iperf3 开启服务端 假设在一台I ...
- [CF1091D]New Year and the Permutation Concatenation
link 题目大意 给$n!$个$n$的排列,按字典序从小到大连成一条序列,例如$3$的情况为:$[1,2,3, 1,3,2, 2,1,3 ,2,3,1 ,3,1,2 ,3,2,1]$,问其中长度为$ ...
- 10: shiro总结
原篇地址:http://www.cnblogs.com/learnhow/p/5694876.html 本篇内容大多总结自张开涛的<跟我学Shiro>原文地址:http://jinnian ...
- Druid 配置及内置监控,Web页面查看监控内容
1.配置Druid的内置监控 首先在Maven项目的pom.xml中引入包 <dependency> <groupId>com.alibaba</groupId> ...
- Ubuntu下安装nfs服务器
安装 NFS 软件包在 ubuntu 终端输入下面命令安装 NFS 服务器:vmuser@Linux-host: ~$ sudo apt-get install nfs-kernel-server # ...
- sed命令使用介绍(转载)
sed命令介绍 (转自:http://www.cnblogs.com/ggjucheng/archive/2013/01/13/2856901.html) 简介 sed 是一种在线编辑器,它一次处理一 ...
- Java_myBatis_逆向工程
所谓逆向工程,就是根据数据库自动生成项目工程(包括了Interface.POJO.映射文件xml) 逆向工程包:https://github.com/wcyong/mybatisGeneratorCu ...