jQuery Mask Not Working? | XM Community
Solved

jQuery Mask Not Working?

  • 15 March 2019
  • 9 replies
  • 134 views
P
Rank
Userlevel 3
Badge +9
Hello! I have a date question with format of mm/dd/yyyy and we would like the slashes '/' to automatically populate. I've been unable to get this to work though. Any suggestions? This is what I've been trying to use to insert placeholder text + trying to apply the mask:

jQuery("#"+this.questionId+" .InputText").attr("placeholder", "mm/dd/yyyy");
jQuery(function (jQuery) {
jQuery("#"+this.questionId).mask("00/00/0000");
});

The placeholder is working fine but the mask does nothing. I've replaced the $ with jQuery by the way.

I might have tunnel vision at this point and am completely missing whatever I'm doing wrong. All of this is going into the addOnReady section by the way.
icon

Best answer by Anonymous 15 March 2019, 16:26

View original

9 replies

A
Hello @Pete_L ,

Step 1: Paste the below code in the header ( source view )

<script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/jquery.inputmask.bundle.js" crossorigin="anonymous"></script>


Step 2: Paste the below code in the js(OnReady) of the question

jQuery("#"+this.questionId+" .InputText").inputmask('99/99/9999',{placeholder:"mm/dd/yyyy"});


Also, check content validation on this question
P
Rank
Userlevel 3
Badge +9
Thank you Shashi! I take it the script I was using is not part of the native jQuery functions then...

Your solution does indeed work. Would there be any concerns on my end from using the file directly from aws? I feel apprehensive using an outside source file in our survey, as I don't fully understand everything occurring in that js file.

If a script exists within jQuery that Qualtrics has tied itself to, or maybe a native JavaScript solution, I'm far more comfortable with that!
P
Rank
Userlevel 3
Badge +9
Maybe this - can I store the jquery.inputmask.bundle.min file itself somewhere in Qualtrics (similar to the one that the AWS server is using) instead of referencing it off of AWS?
A
> @Pete_L said:
> Maybe this - can I store the jquery.inputmask.bundle.min file itself somewhere in Qualtrics (similar to the one that the AWS server is using) instead of referencing it off of AWS?

Yes, you can save the content of above URL in the txt file and upload to qualtrics library, then replace the above aws URL with uploaded file URL
P
Rank
Userlevel 3
Badge +9
Library > File Library correct?

When I attempt to upload the jquery.inputmask.bundle.min.js file I get an error saying:
"The file you have uploaded is a disallowed file type."
A
> @Pete_L said:
> Library > File Library correct?
>
> When I attempt to upload the jquery.inputmask.bundle.min.js file I get an error saying:
> "The file you have uploaded is a disallowed file type."

save file as txt file
P
Rank
Userlevel 3
Badge +9
I was unable to reference the text file properly, but I ended up hosting the .js file on an organizational server with their approval.

It would still be nice to figure out how to use the .txt file as a javascript file inside the Qualtrics file library that can be referenced from the header of a survey 😃 if it's possible.

I used the directions from the help directory on how to link it after saving the .js as a .txt

As a .txt it had no impact. Not sure why not. But once I moved it over to the organization library and kept it as a .js file, everything works fine.
A
> @Pete_L said:
> I was unable to reference the text file properly, but I ended up hosting the .js file on an organizational server with their approval.
>
> It would still be nice to figure out how to use the .txt file as a javascript file inside the Qualtrics file library that can be referenced from the header of a survey 😃 if it's possible.
>
> I used the directions from the help directory on how to link it after saving the .js as a .txt
>
> As a .txt it had no impact. Not sure why not. But once I moved it over to the organization library and kept it as a .js file, everything works fine.

Please see this post
P
Rank
Userlevel 3
Badge +9
Interesting work around!

When I try to reference the file in the survey header, the URL from the File Library is using a .phpf=xxxxxxx reference and is not being read by the survey. Any idea how to get the actual file-path so that it can be referenced?

Leave a Reply


Terms & Conditions