datatables with bootstrap select odd row not working

martinpfeng

I had a problem selecting odd rows using datatables with bootstrap. I found two discussions here, but both are closed but no solution was provided. I open this discussion for anyone who has the same problem.

martinpfeng

This may be helpful for those who use datatables and Bootstrap 3 in the same project: I use Visual Studio and I have a MVC project which also includes Bootstrap 3. If I removed Bootstrap from my project, I noticed both odd and even rows are highlighted when selected, so I assumed there must be something in Bootstrap that overwrites the background color of selected rows.

The next Boostrap code already exists in bootstrap.css and what it does is change the background color for the odd lines.

.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
background-color: #f9f9f9;
}

I added the following code to the bootstrap.css, just AFTER the previous code lines. I don't find this solution elegant, but it worked for me.

.table-striped > tbody > tr.selected > td,
.table-striped > tbody > tr.selected > th {
background-color: #A9D0F5; /* change #A9D0F5 by the color of your preference */
}

rbasto

i am having the same problema. Try to use datatables generated by editor width https://startbootstrap.com/themes/sb-admin-2/ theme adn dropdown just dosen't work!!
Is a way to fix this?
Many thanks!

tangerine

The original poster doesn't mention dropdown, so you seem to have a different problem. Linking to.a Bootstrap theme doesn't help.
Please provide a link to a runnning test case from which we could try debugging.
https://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read#latest

Also, " dropdown just dosen't work" is not helpful. Please explain what is happening