CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrapbootstrap-4
Koder
Koder

Reputation: 111

Adding a class to dynamic Bootstrap Table rows

So I want to add a class to my table rows except the header but I can't figure out how to do it. Does somebody know how i can do this?

this is my table:

<table id="table" class="hidden table table-bordered table-striped table-hover">
    <thead>
        <tr>
            <th data-field="variant">Variant</th>
            <th data-field="description">Description</th>
        </tr>
    </thead>
</table>

and this is currently where i add the data and want to add the classes to the rows

$('#table').bootstrapTable({
    data: returnValue
});

Upvotes: 2

Views: 9108

Answers (2)

jidexl21
jidexl21

Reputation: 619

look at the bootstrap table documentation and use the row style properties, I'm not familiar with that plugin but I guess it should be something like this

$('#table').bootstrapTable({
    data: returnValue, 
    rowStyle :  function(row, index) {
     return {
     classes: 'text-nowrap another-class',
     css: {"color": "blue", "font-size": "50px"}
     };
 }
});

read the docs here http://bootstrap-table.wenzhixin.net.cn/documentation/

Upvotes: 5

JYoThI
JYoThI

Reputation: 12085

1st : add tbody tag in html table

2nd : simple add the class for you tbody tr only like this 

$('#table tbody tr').addClass("newclass");

HTML :

<table id="table" class="hidden table table-bordered table-striped table-hover">
    <thead>
        <tr>
            <th data-field="variant">Variant</th>
            <th data-field="description">Description</th>
        </tr>
    </thead>
    <tbody>  //tbody added here  
        <tr>
        ....
        </tr>
    </tbody>
</table>

In jquery 

$('#table tbody tr').addClass("newclass");

Upvotes: 0

Related Questions