使用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前端修改后台传来的数据重新进行渲染的更多相关文章

  1. django:bootstrap table加载django返回的数据

    bootstrap table加载表格数据有两类方式: 一种通过data属性的方式配置,一种是javascipt方式配置 这里看js配置方式: 1.当数据源为.json文件时 url参数写上json文 ...

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

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

  3. bootstrap table 前端搜索

    1.bootstrap-table对于前端的搜索可以通过官网设置,但发现前端搜索出现bug,网上找到一个bootstrap-table的扩充js  bootstrap-table-mytoolbar. ...

  4. 通过form表单上传文件获取后台传来的数据

    小伙伴是不是遇到过这样的问题,通过submit提交form表单的时候,不知怎么获取后台传来的返回值.有的小伙伴就会说你不会发送ajax,其实也会.假如提交的form表单中含有文件,怎么办? 步骤1:想 ...

  5. BootStrap table动态增删改表格内数据

    1:添加一个[操作]列   { title: "操作", align: 'center', valign: 'middle', width: 160, // 定义列的宽度,单位为像 ...

  6. bootstrap table 根据单元格中的数据改变单元格的样式

    在bootstrap-table.js里面列属性 formatter就是用来格式化单元格的,其默认值是undefined 类型是function,function(value,  row, index ...

  7. bootstrap table通过ajax获取后台数据展示在table

    1. 背景 bootstrap table 默认向后台发送语法的dataType为 json,但是为了解决跨域问题我们需要将dataType改为jsonp,这时就需要修改bootstrap table ...

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

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

  9. bootstrap table + spring + springmvc + mybatis 实现从前端到后端的表格分页

    1.使用准备 前台需要的资源文件,主要有Bootstrap3相关css.js以及bootstrap Table相关css.js: <-- 样式 --> <link rel=" ...

随机推荐

  1. NOIP 普及组 2012 寻宝(思维???)

    传送门 https://www.cnblogs.com/violet-acmer/p/9937201.html 题解: 一开始用暴力查找下一个要去的房间,超时了,emmmmm....... 然后,就稍 ...

  2. python多继承中子类访问祖先类的同名成员

    子类调用父类的同名成员 方式1: class A: def f_a(self): print("----A----") class B: def f_a(self): print( ...

  3. Luogu P2852 [USACO06DEC]牛奶模式Milk Patterns

    题目链接 \(Click\) \(Here\) 水题.利用\(Height\)的性质维护一个单调栈即可. #include <bits/stdc++.h> using namespace ...

  4. String类中"=="、equals和普通类中"=="、equals的比较

    package cn.method.demo; public class StringDemo2 { public static void main(String[] args) { String s ...

  5. Mac 上有哪些比较有意思的小软件?

    文章素材来源:微博.新浪看点 收录于:风云社区(SCOEE)[提供mac软件下载] 更多专题,可关注小编[磨人的小妖精],查看我的文章,也可上[风云社区 SCOEE],查找和下载相关软件资源. (一) ...

  6. bzoj4326 树链剖分 + 线段树 // 二分 lca + 树上差分

    https://www.lydsy.com/JudgeOnline/problem.php?id=4326 题意:N个点的树上给M条树链,问去掉一条边的权值之后所有树链长度和的最大值最小是多少. 首先 ...

  7. E2E测试框架

    1. 目前E2E测试工具有哪些? 项目 Web Star puppeteer Chromium (~170Mb Mac, ~282Mb Linux, ~280Mb Win) 41427 nightma ...

  8. Tensorflow object detection API 搭建物体识别模型(四)

    四.模型测试 1)下载文件 在已经阅读并且实践过前3篇文章的情况下,读者会有一些文件夹.因为每个读者的实际操作不同,则文件夹中的内容不同.为了保持本篇文章的独立性,制作了可以独立运行的文件夹目标检测. ...

  9. Java笔记——泛型擦除

    1. 泛型擦除 package cn.Douzi.T_Demo; import java.util.ArrayList; /** * @Auther: Douzi * @Date: 2019/3/8 ...

  10. springBoot整合mybatis、jsp 或 HTML

    springBoot整合mybatis.jsp Spring Boot的主要优点: 1:  为所有Spring开发者更快的入门: 2:  开箱即用,提供各种默认配置来简化项目配置: 3:  内嵌式容器 ...