使用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. 【转】bootstrap table轻松实现数据表格

    在使用bootstrap table时可能在很多时候回用的表格来显示数据,如果自己写那肯定没问题,但是数据展示出来就麻烦多了,然而bootstrap table 封装了一套完善的数据表格组件,把从后台 ...

  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. MVC bootstrap 实现 bootstrap table 左右传递数据

    源码: @{ ViewBag.Title = "Index"; } @using BC.Platform.UPMS.Models; <!DOCTYPE html> &l ...

  5. bootstrap table加载数据

    //html <table id="dailyDevTable"></table> //js $(function () { initTable(); }) ...

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

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

  7. bootstrap table 的searchParam参数传递

    bootstrap table 的searchParam自定义参数传递 Bootstrap Table返回的数据为value 和 rows Long total代表的是多少条(总数)  List< ...

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

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

  9. bootstrap table 获取数据后的前台页面(后台怎么传就不必详细说明了吧)

    <%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ t ...

随机推荐

  1. 使用正则真正的修改TP5的config.php文件

    来源 https://www.kancloud.cn/manual/thinkphp5/118026 问题 前台传值后台使用Config::set()方法写入config.php文件,但是并没有真正的 ...

  2. EF 事务

    http://yanwushu.byethost7.com/?p=87 1. EF对事务进行了封装:context的saveChange()是有事务性的. 2. 依赖多个不同的Context的操作(即 ...

  3. day21 正则表达式

    正则表达式 简单的范围的字符组 0-9 匹配所有的数字 a-z 匹配所有的小写字母 A-Z 匹配所有的大写字母 A-Za-z 匹配所有的字母 字符 . 换行符以外的任意字符 \w word 匹配数字, ...

  4. 【 Gym - 101138J 】Valentina and the Gift Tree(树链剖分)

    BUPT2017 wintertraining(15) 4 D Gym - 101138J 数据 题意 n个节点的一棵树,每个节点的权值为g,q个询问,树上的节点U-V,求U到V的路径的最大子段和. ...

  5. 沉迷Link-Cut tree无法自拔之:[BZOJ3669][Noi2014] 魔法森林

    来自蒟蒻 \(Hero \_of \_Someone\) 的 \(LCT\) 学习笔记 $ $ 有一个很好的做法是 \(spfa\) ,但是我们不聊 \(spfa\) , 来聊 \(LCT\) \(L ...

  6. Powershell script to install Windows Updates (msu) from folder

    ######################################################### # # Name: InstallWindowsUpdates.ps1 # Auth ...

  7. 【转】位置式、增量式PID算法C语言实现

    位置式.增量式PID算法C语言实现 芯片:STM32F107VC 编译器:KEIL4 作者:SY 日期:2017-9-21 15:29:19 概述 PID 算法是一种工控领域常见的控制算法,用于闭环反 ...

  8. 【GYM 102059】2018-2019 XIX Open Cup, Grand Prix of Korea

    vp了一场gym,我又开心地划水了. A. Coloring Roads 题意:给定一棵树,树边一开始都是无色的,每次操作可以把一个点到根的路径染成某个颜色,每次询问当前树上出现过某个次数的颜色种数. ...

  9. Raspbian开启root账户

    启用root账户 使用默认用户pi,密码raspberry登录树莓派 sudo passwd root #给root账户设置密码 sudo passws --unlock root #解除root账户 ...

  10. A1104. Sum of Number Segments

    Given a sequence of positive numbers, a segment is defined to be a consecutive subsequence. For exam ...