站内搜索:
首页 >> 前端 >> 内容
Bootstrap隐藏table中的某一列代码实现教程

时间:2017/10/23 16:15:25

Bootstrap隐藏table中的某一列代码实现教程

一、

利用bootstrapTable来设置要隐藏和显示的列

$(function () {
//初始化table
  LoadingDataListOrderRealItems();
//隐藏列
  $('#tableOrderRealItems').bootstrapTable('showColumn', 'ShopName');
  $('#tableOrderRealItems').bootstrapTable('hideColumn', 'GoodsId');
  $('#tableOrderRealItems').bootstrapTable('hideColumn', 'OrderItemId');
  $('#tableOrderRealItems').bootstrapTable('hideColumn', 'ShopName');      
  $('#tableOrderRealItems').bootstrapTable('hideColumn', 'SellerName');
}); 

二、

也可以直接使用hidden属性来设置

columns: [{
      field: 'OrderId',
      title: '#',
      align: 'center',
    }, {
      field: 'OrderItemId',
      title: 'OrderItemId',
      align: 'left',
      hidden:true,
    }, {
      field: 'GoodsId',
      title: 'GoodsId',
      align: 'left',
      hidden:true,
    }, {
      field: 'OrderCode',
      title: '订单编号',
      align: 'left',
    }, {

这些方法是为了有的时候,表格需要有这么几列数据的存储,以供程序员使用,而不需要被展示出来,这时就需要将相应的列隐藏。

  • 上一篇:添加数据传表格代码教程
  • 下一篇:浏览器判断函数的工具代码
  • 返回顶部