Change columns header color

[kingdompParticipant]

Hi,

I update my jQWidget to 3.9.1 and the code I use to change the header color in a grid don’t work anymore. Before I user this line :

$(“#MYGRID .jqx-grid-column-header:eq(0)”).css(‘background-color’, ‘#00FF00’);
where MYGRID was my DIV and eq(X) my column index

Now, if the column was not show at the screen, is look not exist in the background when before it was their. Now, How I can write and read my header color in a grid ?

[HristoParticipant]

Hello kingdomp,

Solution of this issue. In this example I write this rows of code:

var firstNameCell = $('div .jqx-grid-column-header:eq(0)');
firstNameCell.css('background-color', 'rosybrown');

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[vmuruganParticipant]

Hi Team,

I have applied separate background using this tag “(“#columntablegrid”).children(“div:eq(0)”).css(“background-color”, “red”);”.

But this will be applied first 11 row. but after that remaining row this color was not applied. Please let me know what i do mistakes here.

$(“#columntablegrid”).children(“div:eq(1)”).css(“background-color”, “red”);
$(“#columntablegrid”).children(“div:eq(2)”).css(“background-color”, “green”);
$(“#columntablegrid”).children(“div:eq(3)”).css(“background-color”, “yellow”);
$(“#columntablegrid”).children(“div:eq(4)”).css(“background-color”, “gray”);
$(“#columntablegrid”).children(“div:eq(5)”).css(“background-color”, “red”);
$(“#columntablegrid”).children(“div:eq(6)”).css(“background-color”, “green”);
$(“#columntablegrid”).children(“div:eq(7)”).css(“background-color”, “yellow”);
$(“#columntablegrid”).children(“div:eq(8)”).css(“background-color”, “gray”);
$(“#columntablegrid”).children(“div:eq(9)”).css(“background-color”, “red”);
$(“#columntablegrid”).children(“div:eq(10)”).css(“background-color”, “green”);
$(“#columntablegrid”).children(“div:eq(11)”).css(“background-color”, “yellow”);
// here not applied color
$(“#columntablegrid”).children(“div:eq(12)”).css(“background-color”, “gray”);

Note: The above mentioned syntex also working like this.

[HristoParticipant]

Hello vmurugan,

You could use all available classes documented here:
https://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-styling-and-appearance.htm?search=grid
If you want the same thing to change the background color of the column’s header I suggest you use the jqx-widget-header class of the Grid.
Please, take a look at this example.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts