Forum

November 2nd, 2014
A A A
Avatar

Lost password?
Advanced Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

The forums are currently locked and only available for read only access
sp_Feed Topic RSS sp_TopicIcon
How to change subgrid header background color
20/02/2009
19:07
Avatar
maggie
Member
Members
Forum Posts: 49
Member Since:
17/12/2008
sp_UserOfflineSmall Offline

Hello,

I tried to change the subgrid header background color from blue to grey. I tried to configure themes\\basic\\grid.css but it does not work.  Can you please help me? Thanks!

Thanks!

Maggie

24/02/2009
07:40
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Hello,

Look in the CSS carfully. There are items for the subgrid where you can play with this. It should work.

Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

24/02/2009
10:19
Avatar
maggie
Member
Members
Forum Posts: 49
Member Since:
17/12/2008
sp_UserOfflineSmall Offline

I found the css and it worked! Thanks!

Maggie

24/02/2009
16:13
Avatar
cartman
Member
Members
Forum Posts: 18
Member Since:
14/02/2009
sp_UserOfflineSmall Offline

Maggie, can you post your findings here so others can learn from it? 🙂

Thanks

25/02/2009
09:33
Avatar
maggie
Member
Members
Forum Posts: 49
Member Since:
17/12/2008
sp_UserOfflineSmall Offline

Hello,

I use the css file /themes/basic/grid.css. There is a section for subgrid. There you should find a style called celldivth which is the style for the subgrid header. I change the background-color to #DDDDDD which is grey.

.celldivth {
 float: left; /*fix for  buggy browsers*/
 border: 1px solid #CCCCCC;
 background-color: #DDDDDD;
 border-bottom: 1px solid #CBC7B8;
 text-align: left;
 overflow: auto;
}

 Hope this helps.

Thanks! Maggie

07/10/2009
07:18
Avatar
Corrado
Italy - Milano
Member
Members
Forum Posts: 16
Member Since:
22/05/2009
sp_UserOfflineSmall Offline
JQuery 1.3.1
jqGrid 3.4.4
Hi,
I would like to apply different styles to subgrid. Main grid has:
subGridRowExpanded: function(subgrid_id, row_id) {
     var subgrid_table_id = subgrid_id + “_t”;
     $('#'+subgrid_id).html('<table id=”' + subgrid_table_id + '” class=”scrollSubgrid” cellpadding=”0″ cellspacing=”0″></table>');
}
where the subgrid class name is scrollSubgrid.
In the CSS I duplicated the main grid styles and changed “scrool” to “scrollSubgrid”. What I would like is to change header background and td font color. I wrote:
table.scrollSubgrid thead th  {
  background-color:#C7C422;
  border-right:1px solid #ffffff;
  border-bottom: 1px solid #ffffff; 
  color:#ffffff;
  font-size: 90%;
  font-weight: bold;
  height:auto;
  overflow: hidden;
  padding: 2px;
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
}
table.scrollSubgrid tbody td  {
     border-left: 1px solid transparent;
     border-bottom: 1px solid #809396;
     /*set an unused color to be index color*/
     _border-color:tomato; /*For IE6-*/
     /*then remove this indexed color*/
     _filter:chroma(color=tomato);/*For IE6-*/
     color:#757420;
     font-size: 90%;
     overflow: hidden;
     padding: 2px;
     text-align: left;
     text-overflow: ellipsis;
     white-space: wrap;
}
My subgrid rows has new font color but header doesn't change its background-color. I inspected with FireBug and I have:
<div class=”grid_hdiv” style=”overflow: hidden; width: 705px;”>
<table class=”scroll grid_htable” cellspacing=”0″ cellpadding=”0″ border=”0″ style=”width: 705px;”>
</table>
</div>
<div class=”grid_bdiv” style=”margin: 0px; padding: 0px; overflow: hidden; height: 100%; width: 705px;”>
<table id=”list1_10_t” class=”scrollSubgrid” cellspacing=”0″ cellpadding=”0″ border=”0″ style=”width: 705px;”>
</table>
</div>
Why the header table has not scrollSubgrid class?
Many thanks!
Corrado.
09/10/2009
03:21
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Hello Corrado,

The table that contain the header is created dynamically, so the class scrollSubgrid is not added.

You can do this diffrent ways, One possible solution:

subGridRowExpanded: function(subgrid_id, row_id) {
     var subgrid_table_id = subgrid_id + “_t”;
     ......
     .... jqGrid({.....});
     $(".grid_hdiv table:first","#"+row_id).addClass("scrollSubgrid");   
}
Please let me known if this work.
Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

10/10/2009
08:13
Avatar
Corrado
Italy - Milano
Member
Members
Forum Posts: 16
Member Since:
22/05/2009
sp_UserOfflineSmall Offline

Hi,

with the following bold correction

$('.grid_hdiv table:first', '#'+row_id + ' + tr').addClass("scrollSubgrid");

subgrids have different style.

Many thanks.

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
47 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

OlegK: 1255

markw65: 179

kobruleht: 144

phicarre: 132

YamilBracho: 124

Renso: 118

Member Stats:

Guest Posters: 447

Members: 11373

Moderators: 2

Admins: 1

Forum Stats:

Groups: 1

Forums: 8

Topics: 10592

Posts: 31289

Newest Members:

, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.com

Moderators: tony: 7721, Rumen[Trirand]: 81

Administrators: admin: 66

Comments are closed.
Privacy Policy   Terms and Conditions   Contact Information