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

API:http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/

简单使用:

1、在当前表格的最后新增数据

 
var _data = {
	"name" : name,
 
        ...//some datas

"desc" : desc    }

$("#table_Id").bootstrapTable('append', _data);//_data----->新增的数据

2、在当前表格的首行新增数据

 
var _data = {
	"name" : name,
        ...//some datas
	"desc" : desc
    }
$("#table_Id").bootstrapTable('prepend', _data);//_data----->新增的数据

3、根据id删除行

var ids = [];//定义一个数组
ids.push(id);//将要删除的id存入数组
$("#table_Id").bootstrapTable('remove', {field: 'id', values: ids});//field:根据field的值来判断要删除的行  values:删除行所对应的值

4、删除所有数据

$("#table_Id").bootstrapTable('removeAll');

5、更新指定行的数据

var _data = {
	"name" : name,   
 
        ...//some datas

"desc" : desc
    }

$('#table_Id').bootstrapTable('updateRow', {index: index, row: _data});//index---->更新行的索引。row---->要更新的数据

6、更新指定的列数据

var rows = {
            index : index,  //更新列所在行的索引
            field : "status", //要更新列的field
            value : "正常" //要更新列的数据
        }//更新表格数据        
$('#table_Id').bootstrapTable("updateCell",rows);

7、重新加载数据(分页的时候要注意参数的传递)

var opt = {
         url: "abc.htm", //重新请求的链接
         silent: true,
         .....    //可以加一些请求的参数
        };
//重新加载数据
$("#table_Id").bootstrapTable('refresh',opt);    

  • 6
    点赞
  • 38
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值