8

Using Bootstrap 2.0 I've styled a table using .table-striped. I'm updating rows of data via ajax and when the update is complete, I want to highlight the row, which works on rows that don't have a background-color. So basically, the even rows highlight, the odd rows don't. I'm not sure why that is.

I might just be too tired right now but some advice would be appreciated.

I'm using the following code to trigger the highlight:

$("#row_" + id).effect("highlight", {}, 1500);
Gregg
  • 34,973
  • 19
  • 109
  • 214

2 Answers2

13

Run the effect not on the row, but on the cells within the row. All the rows are highlighting, both even and odd. The changing background colour of the odd rows just gets hidden because the table cells' colour is over top.

Quasipickle
  • 4,383
  • 1
  • 31
  • 53
  • Thanks. Will try this tonight and report back. – Gregg Feb 29 '12 at 00:33
  • 1
    It works like a charm. By the way, to my personal case (highlight last row after inserting it), my solution was: `$('#table tr:last').find('td').effect('highlight', {color: '#4BADF5'}, 2000);` – Eagle Oct 31 '13 at 11:50
2

Just to add to Pickle's answer that each cell within the row is above the row colour, see the code below for highlighting each cell instead:

$("#row_" + id +" td").effect("highlight", {}, 1500);

(this assumes that no cells are of type "th" on the row, but that can easily be added if required)

Tim Head
  • 128
  • 2
  • 5