Randomise / flip statement rows of a bipolar likert scale matrix question left->right/right->left

You won't be able to do this with one question.
You can can create two sets A...B and B...A. Randomize the statements within them and at the block level, randomize to show only one question.

Hi All,
Thanks for the tips and guidance. TomG I might reach out to you if I can get approval to purchase your functions. Whilst I keep this survey in non-mobile mode...I found that you could easily reverse the direction of the table (ie swap the statements from left to right) by using the 'direction: rtl' term in the css code. :)
So I got as far as creating a copy of the block containing my question and then putting the two blocks in a randomiser block in the survey flow. I then used some Jquery code to change the direction of the table which works to some degree but then I needed to align the text the opposite way. However for some reason I can adjust the AnswerLeft class but not the AnswerRight class.
My code is below. I've tried a number of things but so far haven't worked it out. Can anyone advise?

Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/
// QuestionBody isn't altered if you don't have .SKin in front
// see: https://community.qualtrics.com/XMcommunity/discussion/2747/need-a-code-to-modify-the-padding-for-question-body

jQuery(".Skin .QuestionBody").css({"direction": 'rtl'});
jQuery(".Skin .AnswerLeft").css({"text-align": 'right'}); //

//jQuery(".AnswerRight").css({"text-align": 'right!important'});  //Query(".Skin .Matrix .Bipolar th.AnswerRight").css({"text-align": 'left!important'}); //
});

Also there is one problem with direction:rtl in that the (B7) and (A7) parts of the statement have for some reason move / swapped position to after the 'I prefer wording. Nothing else have changed. Is this a quirk of brackets ??
Thanks
Rod Pestell

Hi TomG

I thought you wanted to randomize on a row basis instead of a question basis?

Yes I was aiming for this but decided to just invert the whole question (which took me down the route of using two blocks with a randomiser block) but as I've now got it working in JS code I could just use one question and use an incremental counter to run the code. I could use a quota counter to do that and whenever it's an even number then invert it. I'll give that a go and see where we get to. My only worry is that what if a person doesn't finish the survey - will the counter still increase once the survey does get closed (by the system)? Perhaps I should use something else?

Thanks for letting me know about the css and !important issue - I didn't realise that. That saved me a bit of time so I went back to google and found a couple of solutions. The nicest / simplest one seems to use attr(
jQuery(".Skin .AnswerRight").attr("style", "text-align: left !important");
source: https://stackoverflow.com/questions/2655925/how-to-apply-important-using-css
(about half way down)

There were a number of more complex solutions and a number of people saying it wold change all styles but as I'm jQuerying the specific .AnswerRIght class and this question is the only one on the page, I don't think it would be an issue, would it?
The post I found was rather old so I'm hoping that this attr( method will be ok. To check, I've got Edge, Android (tablet / phone but suspect it won't look at good), Chrome and Firefox but not Safari so I hope that it will still work as expected.
Any thoughts most welcome
Thanks
Rod Pestell

Just had a brain wave! I don't need to use a quota, I can just use the randomizer block in the survey flow and create an embedded field and this is then updated in one of the blocks to either 'default' or reversed. Then I'll just use that in the one question with an If logic statement. aha!
Thanks
Rod Pestell

HI All,
I've just come across an issue with the bipolarLeftRightRandomize.js code in that when the page is redrawn (for instance there was an unanswered questions) the routine runs again meaning it randomises the left / right position of the answers. This might confuse the responder. I'm just wondering if there is a way to make this run once and keep the positioning as is.
https://gist.github.com/marketinview/50356345b379ecc6f09b3b29b6074444
Qualtrics.SurveyEngine.addOnload(function() {
jQuery("#"+this.questionId+" .ChoiceRow").each(function() {
if(Math.random() < 0.5) {
var row = jQuery(this);
row.children().each(function() { row.prepend(jQuery(this)); });
row.find("th").first().removeClass("AnswerLeft").addClass("AnswerRight");
row.find("th").last().removeClass("AnswerRight").addClass("AnswerLeft");
}
});
});
for the time being I've removed the math.random function and used the randomiser in the survey flow (setting a variable to either 'default' or 'reversed' which then at least controls whether all statements should be flipped left to right or left alone. I would still like to work out a way to flip them. The only way I can think is by building the randomiser in the survey flow to cater for the 16 or so statements I am using but that's probably rather a clunk way. Does anyone have a better way?

Thanks

Rod Pestell

This is my code so far with a screenshot of my survey flow.
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/

var Q_Order = Qualtrics.SurveyEngine.getEmbeddedData("Segment_Q_Order")
if ( Q_Order == "Reversed") {

jQuery("#"+this.questionId+" .ChoiceRow").each(function() {
// if you want to change individual rows you can put in something like if(Math.random() < 0.5) {...
// the draw back is that when the screen is redrawn due to an unswered question it can change again
var row = jQuery(this);
row.children().each(function(i) { row.prepend(jQuery(this)); });
row.find("th").first().removeClass("AnswerLeft").addClass("AnswerRight");
row.find("th").last().removeClass("AnswerRight").addClass("AnswerLeft");

});

}

});