CODEWITHSUNDEEP
jquery-bootgrid
Lubna
Lubna

Reputation: 31

How to select few columns by default in jQuery Bootgrid

I am trying to use http://www.jquery-bootgrid.com/examples#data-api

When table is loaded from SQL database, all columns show up as all check boxes are marked in drop down menu (image attached), I want that only selected columns show up by defult and user can mark the the realted column field in check box to make it visible.

.Image here

<table id="employee_grid" class="table table-condensed table-hover table-striped" width="70%" cellspacing="0" data-toggle="bootgrid">
            <thead>
                <tr>
                    <th data-column-id="id" data-type="numeric" data-identifier="true">id</th>
                    <th data-column-id="own_referrer">O_Refferer</th>
                    <th data-column-id="own_aact_status">own_aact_status</th>
                    <th data-column-id="rate">rate</th>
                    <th data-column-id="text_Details">text_Details</th>
                    <th data-column-id="remarks">remarks</th>

                    <th data-column-id="commands" data-formatter="commands" data-sortable="false">Commands</th>
                </tr>
            </thead>
</table>

Upvotes: 0

Views: 332

Answers (1)

Lubna
Lubna

Reputation: 31

found the solution. Just add ( data-visible="false" ) (without brackets) to the respective th line in table.

<table id="employee_grid" class="table table-condensed table-hover table-striped" width="70%" cellspacing="0" data-toggle="bootgrid">
    <thead>
        <tr> 
           <th data-column-id="own_referrer" data-visible="false">O_Refferer</th> 
           <th data-column-id="own_referrer">O_Refferer</th>
           <th data-column-id="own_aact_status">own_aact_status</th>
           <th data-column-id="rate">rate</th>
           <th data-column-id="text_Details">text_Details</th>
           <th data-column-id="remarks">remarks</th>
           <th data-column-id="commands" data-formatter="commands" data-sortable="false">Commands</th>
        </tr>
    </thead>
</table>

Upvotes: 2

Related Questions