Javascript for adding symbols before and after fields in just one column of a 3D Matrix | XM Community
Solved

Javascript for adding symbols before and after fields in just one column of a 3D Matrix

  • 20 August 2020
  • 7 replies
  • 175 views
MatthewM
Rank
Userlevel 7
Badge +30
  • MatthewM
  • Level 6 ●●●●●●
  • 1055 replies

I've previously used the following code in a survey to insert $ and .00 around all text fields in a 3D Matrix.
Qualtrics.SurveyEngine.addOnload(function()
{
var inputs = $(this.getQuestionContainer()).select('input[type="text"]');

for (var i = 0; i < inputs.length; i++) {
 var input = inputs[i];
 $(input).insert({before: '$ '});
 $(input).insert({after: ' .00'});
}

});

My problem now is that I have a 3D Matrix question with two columns, but I would only like the symbols to be applied to the second column. What do I need to change in my Javascript to make it happen? (Thank you in advanced if you can help.)

icon

Best answer by SurajK 20 August 2020, 23:31

View original

7 replies

SurajK
Rank
Userlevel 5
Badge +4

Hi MatthewM ,
Just change the for loop, you will see the symbols added in 2nd column only.
Qualtrics.SurveyEngine.addOnload(function()
{
var inputs = $(this.getQuestionContainer()).select('input[type="text"]');
for (var i = 1; i < inputs.length; i+=2) {
 var input = inputs[i];
 $(input).insert({before: '$ '});
 $(input).insert({after: ' .00'});
}
});

MatthewM
Rank
Userlevel 7
Badge +30

Thank you SurajK!
I used the code and it adds $ and .00 on the text input fields, but took it away from the Total line. Is there a way to insert these on the Total line too?
image.png

SurajK
Rank
Userlevel 5
Badge +4

https://www.qualtrics.com/community/discussion/comment/29369#Comment_29369Ok, so in this case we can add 2 extra lines for the total box and using index we can add the symbols like below, as per your screenshot, the total box has index 6.
Qualtrics.SurveyEngine.addOnload(function()
{
var inputs = $(this.getQuestionContainer()).select('input[type="text"]')
for (var i = 1; i < inputs.length; i+=2) {
 var input = inputs[i];
 $(input).insert({before: '$ '});
 $(input).insert({after: ' .00'});
}
jQuery('input[type="text"]').eq(6).before('$')
jQuery('input[type="text"]').eq(6).after(' .00')
});

MatthewM
Rank
Userlevel 7
Badge +30

That did it! Thank you so much!

A
Badge

SurajK How are you buddy?
I wanted to check how to program the distinct signs/text per column. Please see screenshot to give you the graphic:
image.pngAppreciate your kind help in advance! :)
Best,
Abhi

SurajK
Rank
Userlevel 5
Badge +4

Abi - I'm good, hope you are doing well too!
You can use the below code to insert the text before and after the open end, as per your screenshot.
Qualtrics.SurveyEngine.addOnReady(function()
{
//First Column
jQuery('#'+this.questionId+' tbody tr .c4 input[type="text"]').after('% increase in ORR')
jQuery('#'+this.questionId+' tbody tr .c4 input[type="text"]').before('Absolute')
//Second Column
jQuery('#'+this.questionId+' tbody tr .c5 input[type="text"]').after('months over SoC')
jQuery('#'+this.questionId+' tbody tr .c5 input[type="text"]').before('+')
//Third Column
jQuery('#'+this.questionId+' tbody tr .c6 input[type="text"]').after('months over SoC')
jQuery('#'+this.questionId+' tbody tr .c6 input[type="text"]').before('+')
//Fourth Column
jQuery('#'+this.questionId+' tbody tr .c7 input[type="text"]').after('% decrease in grade 3-4 TRAE')
jQuery('#'+this.questionId+' tbody tr .c7 input[type="text"]').before('Absolute')

});

LouRisc
Rank
Userlevel 2
Badge +1

https://community.qualtrics.com/XMcommunity/discussion/comment/29368#Comment_29368Hello SurajK,
I just applied your code (quoted here) to a side by side question in my survey that has several columns. I wanted to see if it would work on my second column only (the first has essay open-ended text fields, the second has medium open-ended text with numerical validation, and the third consists of a drop down list). Much to my delight, the "$ " and the " .00" applied only to the appropriate column (#2). However, it only applied itself to alternating rows. In my experimenting, I changed the last number in this line from 2 to 1:
for (var i = 1; i < inputs.length; i+=1) {
To my surprise, that worked, with one remaining issue. The "$ " and the " .00" are now applied to every row except the very first row. My tinkering has not solved this problem. Do you have any advice?
Thank you!

Leave a Reply


Terms & Conditions