Add jQuery calculator to text input | Experience Community
Skip to main content

Add jQuery calculator to text input

  • Dec 29, 2022 6:06 PM UTC
  • 6 replies
  • 391 views

Forum|alt.badge.img

Hi,
I've been attempting to add a drop-down calculator to a text input (from http://keith-wood.name/calculator.html) but the calculator doesn't show up at all. I'm not sure what I am doing wrong and I'm new to javascript. Any help would be appreciated!
I uploaded the jquery.calculator.css, jquery.calculator.js, and jquery.plugin.js text files to Qualtrics library.
Here's what I have in the HTML section of the text input:
 
 

Here's what I have in the Javascript section:
jQuery("#"+this.questionId+" .InputText").calculator();

6 replies

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • Level 8 ●●●●●●●●
  • Dec 29, 2022 9:40 PM UTC

You should load it from jsDelivr instead. Put the html in the survey header or footer (edit in source mode):



Forum|alt.badge.img
  • Author
  • Jan 1, 2023 5:23 PM UTC

Hi Tom,
Happy new year! Thank you for answering so quickly. I've pasted your html to the survey header (definitely in source mode), but unfortunately it's still not working. Is there anything else I should be taking note of?


TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • Level 8 ●●●●●●●●
  • Jan 2, 2023 4:11 PM UTC

https://community.qualtrics.com/XMcommunity/discussion/comment/53502#Comment_53502Turns out that the plugin needs to be loaded before the calculator. I've updated the code in the post above.


Forum|alt.badge.img
  • Author
  • Jan 5, 2023 1:20 PM UTC

Thanks for updating the code. I've tried it, but the calculator still doesn't show up. Has it worked for you?


TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • Level 8 ●●●●●●●●
  • Jan 5, 2023 2:29 PM UTC

Yes, it works. Here is a link to a preview. The JS is:
Qualtrics.SurveyEngine.addOnload(function() {
jQuery("#"+this.questionId+" .InputText").calculator();
});


Forum|alt.badge.img
  • Author
  • Jan 5, 2023 3:18 PM UTC

I have no idea what was different in my JS but after I cleared it and only added your line of JS code it worked?! Thanks so much Tom, you are a life saver. Cheers!