Troubleshooting - dynamically display calculated value | XM Community
Skip to main content
Solved

Troubleshooting - dynamically display calculated value

  • September 14, 2023
  • 2 replies
  • 45 views

Forum|alt.badge.img+1

Hello! I have gotten a very basic understanding of some JQuery and HTML from previous posts and w3schools. I’m sure it’s something horribly obvious, but I can’t figure out what I’m doing wrong when I try to duplicate the code from this post: Display math operation results real-time | XM Community (qualtrics.com)

I have a form field question with three fields. In the question text, I put <div id = “total”></div>, and I have this code:

Qualtrics.SurveyEngine.addOnReady(function()
{
var textInputs = jQuery("#"+this.questionId+" .InputText");
    textInputs.blur(function() {
var txtFirstNumberValue = parseInt(textInputs.eq(0).val());
var txtSecondNumberValue = parseInt(textInputs.eq(1).val());
var txtThirdNumberValue = parseInt(textInputs.eq(2).val());
var result =parseInt(txtFirstNumberValue)*2 + parseInt(txtSecondNumberValue)*3+ parseInt(txtThirdNumberValue)*5;
jQuery("#total").text(result);

});
});

 

But nothing shows up for the total when I enter values into the question’s text boxes. Am I defining the HTML element incorrectly?

 

Best answer by TomG

You html and code look OK, other than it will display NaN until you fill in all the amounts.  Are you using simple layout? If so, that’s your problem.

2 replies

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • Level 8 ●●●●●●●●
  • 6084 replies
  • Answer
  • September 14, 2023

You html and code look OK, other than it will display NaN until you fill in all the amounts.  Are you using simple layout? If so, that’s your problem.


Forum|alt.badge.img+1
  • Author
  • 1 reply
  • September 14, 2023

@TomG THANK YOU for saving me from my idiotic ignorance!