Matrix table, Cleave, and math operation | XM Community
Skip to main content

I have a matrix table like this:
image.pngI'd like to apply Cleave code to all of the inputs, so I used the following code:
Qualtrics.SurveyEngine.addOnReady(function() {
var inputs = jQuery("input[type='text']");
inputs .toArray() .forEach(function(field)
{
new Cleave(field,
{
numeral: true,
numeralThousandsGroupStyle: 'thousand'});

Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
   cleave.element.value = cleave.getRawValue();
});
});
});
The above code works well. I can see my numbers have thousand commas.
Now I want to do some math works using the inputs in the next page. But the problem is that in the next page, it looks like the inputs are transformed into string. What I want to do is:
SUM column 1 = $e{ q://QID1/ChoiceTextEntryValue/1/1 + q://QID1/ChoiceTextEntryValue/2/1 + q://QID1/ChoiceTextEntryValue/3/1 }

I tried to use the code

cleave.element.value = cleave.getRawValue();
, but this only works for one text entry, not for matrix table.
Please help me!




You need to save your cleaves to an array, then you can loop through them to get all the raw values.


TomG , thank you for your response. I'm not very experienced with java script, so could you please review my code?
Qualtrics.SurveyEngine.addOnReady(function()
{
var inputs = $(this.getQuestionContainer()).select('input[type="text"]');

for (var i = 0; i < inputs.length; i++) {
 var input = inputssi];
 };
var cleave = new Cleave(".InputText", {numeral: true, numeralThousandsGroupStyle: 'thousand'});

Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
   cleave.element.value = cleave.getRawValue();
});
});

I tried this code, but I failed to get what I wanted.


Add

var cleaves = [];
at the beginning, then
cleaves[] = new Cleave(...
Then loop through cleaves in your addOnPageSubmit function.


Sorry, TomG , I'm struggling with fixing the code...
I got an error message for my new invalid code:
Qualtrics.SurveyEngine.addOnReady(function()
{
var cleaves = [];
cleaves[] = new Cleave(".InputText", {numeral: true, numeralThousandsGroupStyle: 'thousand'});

var inputs = $(this.getQuestionContainer()).select('input[type="text"]');

for (var i = 0; i < inputs.length; i++) {
  var cleave = cleavessi];
 };


Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
for (var i = 0; i < inputs.length; i++) {
  var cleave = cleavesvi];
  cleave.element.value = cleave.getRawValue();


});
});
I couldn't understand why I got his error: "Invalid JavaScript! You cannot save until you fix all errors: Unexpected token ]"


Hello TomG ,
I tried to fix the code but it does not work well. I got no error messages, but I still cannot get raw value. Could you please review and fix it to work?
Qualtrics.SurveyEngine.addOnReady(function()
{
var cleaves = [];
cleaves = new Cleave(field,{ numeral: true, numeralThousandsGroupStyle: 'thousand' });


Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
for (var i = 0; i < cleaves.length; i++) {
cleaves.element.value = cleaves.getRawValue();
};
  
});
});


Try:
Qualtrics.SurveyEngine.addOnReady(function()
{
var cleaves = [];
cleaves[] = new Cleave(field,{ numeral: true, numeralThousandsGroupStyle: 'thousand' });


Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
for (var i = 0; i < cleaves.length; i++) {
cleaves[i].element.value = cleaves[i].getRawValue();
};
  
});
});


TomG , thanks for your review.
I tried the revised code, but I got the following error message:
"Invalid JavaScript! You cannot save until you fix all errors: Unexpected token ]"


Oops, got my languages mixed up. Also, I noticed you are missing your initial loop from earlier. I think it should be:

Qualtrics.SurveyEngine.addOnReady(function()
{
var cleaves = [];
var inputs = $(this.getQuestionContainer()).select('input[type="text"]');
for (var i = 0; i < inputs.length; i++) {
  var input = inputssi];
cleavessi] = new Cleave(input,{ numeral: true, numeralThousandsGroupStyle: 'thousand' }));
 };

Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
for (var i = 0; i < cleaves.length; i++) {
inputsti].value = cleavesei].getRawValue();
};
  
});
});
However,


It works! (except for one error)
The final code looks like:
Qualtrics.SurveyEngine.addOnReady(function()
{
var cleaves = [];
var inputs = $(this.getQuestionContainer()).select('input[type="text"]');
    for (var i = 0; i < inputs.length; i++) {
      var input = inputsti];
      cleavesi] = new Cleave(input,{ numeral: true, numeralThousandsGroupStyle: 'thousand' });
};

Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
for (var i = 0; i < cleaves.length; i++) {
inputs)i].value = cleaves.i].getRawValue();
};
 
});
});

Thank you very much TomG !!!!


Leave a Reply