Geek Answers Handbook

Jquery-bootgrid how to hide a column

How to hide a column in the boot grid?

I tried to hide the ID column as follows:

<data-column-id="token" data-identifier="true" data-type="string" visible="false">token<>
+8
jquery jquery-plugins
source share
3 answers

you need to write it like this

 <data-column-id="token" data-identifier="true" data-type="string" data-visible="false">

read here, http://www.jquery-bootgrid.com/Documentation

+14
source share

This will help someone in the future. I will post as an answer by providing a link to it, because sometimes we do not read the comments section.
Answer from

 <style> { .HideColHead { display: none } .HideCol { display: none } </style> <th data-column-id="ID" data-header-css-class="HideColHead" data-css-class="HideCol">ID</th> <th data-column-id="User" data-header-css-class="HideColHead" data-css-class="HideCol">User</th>

It just hides a column that is not removed from the DOM

+1
source share

optional.

Method 1. Update Bootgrid to version 1.3 and install "visible data"

 <th data-column-id="Id" data-visible="false">Id</th>

/ / ----------------------------------

method 2. (old version) use jquery to launch the hide / show column tool.

  <table id="grid-keep-selection" class="table table-condensed table-hover table-striped"> <thead> <tr> <th data-column-id="id_col1" data-order="desc" data-width="4.3%">id_col1</th> <th data-column-id="id_col2" data-order="desc" data-width="4.3%">id_col2</th> <th data-column-id="id_col3" data-order="desc" data-width="4.3%">id_col3</th> </tr> </thead> </table>

/ / --------------------------------------------- -

 var check_first_load = 0; //--> for set default column. $("#grid-keep-selection").bootgrid({ ajax: true, post: function () { return { id: "xx" }; }, url: "api/data/xx.php", formatters: { "commands": function(column, row) { return '<a> xxx </a>'; } } ,labels: { noResults: "where are my results" } }).on("loaded.rs.jquery.bootgrid", function() { //--> for set default hiding column. if(check_first_load == 0){ check_first_load++; $('input[name=id_col1]').trigger("click"); $('input[name=id_col2]').trigger("click"); $('input[name=id_col3]').trigger("click"); } });
0
source share

More articles:


All Articles