Alternating Row Background Colors for Matrix Question not including Statement Group Headers | XM Community
Question

Alternating Row Background Colors for Matrix Question not including Statement Group Headers

E
Rank
Badge +2

How do I alternate background colors for rows in my constant sum matrix table, but only alternate colors of the rows that are specific questions to fill out and keep the colors of the statement group headings the same?

10 replies

Shashi
Rank
Userlevel 6
Badge +27

Try below code:

jQuery(".ChoiceRow.ReadableAlt").each(function(){if(jQuery(this).find(".Group").length==0)jQuery(this).css("background","#d9d9d9");});

 

E
Rank
Badge +2

Try below code:

jQuery(".ChoiceRow.ReadableAlt").each(function(){if(jQuery(this).find(".Group").length==0)jQuery(this).css("background","#d9d9d9");});

 

Thank you this worked! Do you know if there is a way to select a second background color to alternate? Moreover, I’m finding each group starts with a different color each time, is there a way to make each group start with the same color every time? @Shashi 

Shashi
Rank
Userlevel 6
Badge +27

Try below code:

jQuery(".ChoiceRow.ReadableAlt").each(function(){if(jQuery(this).find(".Group").length==0)jQuery(this).css("background","#d9d9d9");});

 

Thank you this worked! Do you know if there is a way to select a second background color to alternate? Moreover, I’m finding each group starts with a different color each time, is there a way to make each group start with the same color every time? @Shashi 

Try this:

var f;
	jQuery("#"+this.questionId+" th.Group").each(function(){
		f=1;
		jQuery(this).parent().nextAll(".ChoiceRow").each(function(i){
			if(jQuery(this).find("th.Group").length==0){
				if( i%2==0 && f==1)
					jQuery(this).css("background","#d9d9d9");
			}else
					f=0;

		});

	});

 

E
Rank
Badge +2

Try below code:

jQuery(".ChoiceRow.ReadableAlt").each(function(){if(jQuery(this).find(".Group").length==0)jQuery(this).css("background","#d9d9d9");});

 

Thank you this worked! Do you know if there is a way to select a second background color to alternate? Moreover, I’m finding each group starts with a different color each time, is there a way to make each group start with the same color every time? @Shashi 

Try this:

var f;
	jQuery("#"+this.questionId+" th.Group").each(function(){
		f=1;
		jQuery(this).parent().nextAll(".ChoiceRow").each(function(i){
			if(jQuery(this).find("th.Group").length==0){
				if( i%2==0 && f==1)
					jQuery(this).css("background","#d9d9d9");
			}else
					f=0;

		});

	});

 

@Shashi this didn’t color any of the rows, should it be in addition to the previous code?

Shashi
Rank
Userlevel 6
Badge +27

@Shashi this didn’t color any of the rows, should it be in addition to the previous code?

No, please attach screenshot where you have paste the code.

E
Rank
Badge +2

@Shashi this didn’t color any of the rows, should it be in addition to the previous code?

No, please attach screenshot where you have paste the code.

@Shashi 

Shashi
Rank
Userlevel 6
Badge +27

Code should be pasted in the onload function like below:

 

E
Rank
Badge +2

Code should be pasted in the onload function like below:

 

@Shashi This worked!! Thank you so much!! One follow up question would be for the alternating colored rows, is there a way to set a second color to alternate between other than white for the rows, not including the group headers, and having the statements within each group both start on the same first color?

Shashi
Rank
Userlevel 6
Badge +27

@Shashi This worked!! Thank you so much!! One follow up question would be for the alternating colored rows, is there a way to set a second color to alternate between other than white for the rows, not including the group headers, and having the statements within each group both start on the same first color?

Try this:

	var f;
	jQuery("#"+this.questionId+" th.Group").each(function(){
		f=1;
		jQuery(this).parent().nextAll(".ChoiceRow").each(function(i){
			if(jQuery(this).find("th.Group").length==0){
				if( i%2==0 && f==1)
					jQuery(this).css("background","#d9d9d9");
				else
					jQuery(this).css("background","#c4acac");
			}else
					f=0;

		});

	});

 

E
Rank
Badge +2

@Shashi This worked!! Thank you so much!! One follow up question would be for the alternating colored rows, is there a way to set a second color to alternate between other than white for the rows, not including the group headers, and having the statements within each group both start on the same first color?

Try this:

	var f;
	jQuery("#"+this.questionId+" th.Group").each(function(){
		f=1;
		jQuery(this).parent().nextAll(".ChoiceRow").each(function(i){
			if(jQuery(this).find("th.Group").length==0){
				if( i%2==0 && f==1)
					jQuery(this).css("background","#d9d9d9");
				else
					jQuery(this).css("background","#c4acac");
			}else
					f=0;

		});

	});

 

Worked! Thank you so much for all your help! @sha

 

Leave a Reply


Terms & Conditions