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 ...
随机推荐
- ELK--filebeat详解
Filebeat提供了几种不同的方式来启用模块: 在modules.d编辑目录中启用模块配置 运行Filebeat 编辑时启用模块 在filebeat.yml文件编辑中启用模块配置 例如,要在 目录中 ...
- ansible创建vmware虚拟机
环境:vmware 虚拟化需求:如果业务部门一次提几十台甚至几百台虚拟机需求,一个个的手动创建肯定耗时 使用ansible vmware_guest 创建虚拟机,避免手动一台一台创建的纯手工 工作废话 ...
- 【BZOJ4503】两个串(FFT)
[BZOJ4503]两个串(FFT) 题面 给定串\(S\),以及带通配符的串\(T\),询问\(T\)在\(S\)中出现了几次.并且输出对应的位置. \(|S|,|T|<=10^5\),字符集 ...
- 【bzoj3064】 CPU监控
http://www.lydsy.com/JudgeOnline/problem.php?id=3064 (题目链接) 题意 给出一个长度为$n$的数列$A$,同时定义一个辅助数组$B$,$B$开始与 ...
- A1023. Have Fun with Numbers
Notice that the number 123456789 is a 9-digit number consisting exactly the numbers from 1 to 9, wit ...
- C# 遍历指定目录下的所有文件及文件夹以及遍历数据库的方法
// DirectoryInfo di = new DirectoryInfo(@"D:\Test"); // FindFile(di); static void FindFile ...
- 十、java_IO
目录: 一.java流式输入/输出原理 二.java流类的分类 三.输入/输出流类 四.常见的节点流和处理流 五.文件流 六.缓冲流 七.数据流 八.转换流 九.Print流 十.Ubject流 一. ...
- HTML中的相对路径与绝对路径(转)
原文地址:http://www.cnblogs.com/heyonggang/archive/2013/03/01/2938984.html 在HTML里只要涉及文件的地方(如超级链接.图片等)就会涉 ...
- jenkins ansible 附zabbix_agent批量安装示例
插件:Ansible plugin 一.ansible ad-hoc command 二.ansible-playbook 批量部署zabbix-agent示例: playbook 目录及文件组成 [ ...
- Tomcat部署实战
Tomcat部署实战 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.登录官网下载tomcat软件包(http://tomcat.apache.org/) 1>.在安装to ...