bootstrap Example of bootstrapTable Implementation of Hidden Columns

Recently in learning bootstrap, just today saw bootstrapTable hidden column, save for future reference.

Main code:

<script type="text/javascript">

    $(function () {
      LoadingDataListOrderRealItems();
      $('#tableOrderRealItems').bootstrapTable('showColumn', 'ShopName');
      $('#tableOrderRealItems').bootstrapTable('hideColumn', 'GoodsId');
    }); 

  </script>

All codes:

<!-- List of goods in order   Module   Begin -->
  <script type="text/javascript">
    function LoadingDataListOrderRealItems() {
      $('#tableOrderRealItems').bootstrapTable({
        url: '/Handler/Handler_Orders/AllOrder_Real_Virtuall_Handler.ashx?func=Get_Orders_Real_SelectGoodsListByOrderId',
        method: 'get', // The default is post, Do not allow access to static files 
        cache: false,
        striped: true, //  Interlaced highlighting 
        pagination: true, //  Turn on paging 
        pageSize: 20, //  Set the default paging to  20
        pageNumber: 1,
        pageList: [10, 25, 50, 100, 200], //  Custom paging list 
        //contentType: "application/x-www-form-urlencoded",// If you want to use request.form  Mode, setting  contentType: "application/x-www-form-urlencoded",
        search: false,// Turn on the search function 
        sidePagination: 'server',// Set to server-side paging 
        queryParams: queryParams,// Parameter 
        showColumns: true, //  Turn on the custom column display function 
        showRefresh: false, //  Turn on the refresh function 
        minimumCountColumns: 2,//  Set the minimum number of displayed columns 
        clickToSelect: true,
        smartDisplay: true,
        clickToSelect: true, //  Click the row to select 
        sortName: 'OrderRealItemsId', //  Set the default sort to  name
        sortOrder: 'desc', //  Set the sort to reverse order  desc
        smartDisplay: true, //  Intelligent display  pagination  And  cardview  Etc 
        dataType: "json",
        
        columns: [{
          field: 'OrderId',
          title: '#',
          align: 'center',
        }, {
          field: 'OrderItemId',
          title: 'OrderItemId',
          align: 'left',
        }, {
          field: 'GoodsId',
          title: 'GoodsId',
          align: 'left',
        }, {
          field: 'OrderCode',
          title: ' Order number ',
          align: 'left',
        }, {
          field: 'GoodsName',
          title: ' Commodity name ',
          align: 'left',
        }, {
          field: 'GoodsMainPic',
          title: ' Picture ',
          align: 'left',
          formatter: function (value, row, index) {
            if (value != "") {
              return '<img style="width:150px;height:100px" src="' + ServiceJsonServiceClient_CommonLib + value + '" />';
            }
            else
              return '<img style="width:150px;height:100px" src="' + Client_NoPicture + '" />';
          }
        }, {
          field: 'Consignor',
          title: ' Consignee ',
          align: 'left',
        }, {
          field: 'ReceiveAddress',
          title: ' Receiving address ',
          align: 'left',
        }, {
          field: 'ReceiveTel',
          title: ' Contact number ',
          align: 'left',
        },{
          field: 'SellerName',
          title: ' Name of Seller ',
          align: 'left',
        }, {
          field: 'ShopName',
          title: ' Name of shop ',
          align: 'left',
        }, {
          field: 'ModelName',
          title: ' Commodity type ',
          align: 'left',
        }, {
          field: 'FinalPrice',
          title: ' Final price ',
          align: 'left',
        }, {
          field: 'GoodsCount',
          title: ' Quantity ',
          align: 'left',
        }, {
          field: 'AppriseStatus',
          title: ' Logistics status ',
          align: 'left',
        }, {
          title: ' Operation ',
          field: 'Id11',
          align: 'center',
          width: '100px',
          formatter: function (value, row, index) {
          
          }
        }]
      });

     
    }
    // Get URL Parameter 
    function GetQueryString(name) {
      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); // Structure 1 Regular expression objects with target parameters 
      var r = decodeURI(window.location.search).substr(1).match(reg); // Matching target parameters 
      if (r != null) return unescape(r[2]); return null; // Returns parameter values 
    }

    // Set incoming parameters 
    function queryParams(params) {

      var OrderId = GetQueryString("OrderId");

      var temp = { // The name of the key here and the variable name of the controller must 1 Straight, change here, and the controller needs to be changed to 1 Like 
        limit: params.limit, // Page size 
        offset: params.offset, // Page number 
        OrderId: OrderId
      };

      return temp;
    }
  </script>

  <script type="text/javascript">

    $(function () {
      LoadingDataListOrderRealItems();
      $('#tableOrderRealItems').bootstrapTable('showColumn', 'ShopName');
      $('#tableOrderRealItems').bootstrapTable('hideColumn', 'GoodsId');
      $('#tableOrderRealItems').bootstrapTable('hideColumn', 'OrderItemId');
      $('#tableOrderRealItems').bootstrapTable('hideColumn', 'ShopName');      
      $('#tableOrderRealItems').bootstrapTable('hideColumn', 'SellerName');
    }); 

  </script>
  <!-- List of goods in order   Module   Begin -->