Help adding placeholder text in text input box | XM Community
Question

Help adding placeholder text in text input box

  • 29 February 2024
  • 12 replies
  • 95 views

Badge +1

I’ve looked at previous posts about adding place holder text and tried a few codes but non seem to be working for me. No text appears. Can anyone please advise on what I’m doing wrong?

 

The code is:
 

Qualtrics.SurveyEngine.addOnReady(function()
{
    /*Place your JavaScript here to run when the page is fully displayed*/

    var placeholderText = 'I am different text';
    jQuery("#"+this.questionId+ " .InputText").attr("placeholder", placeholderText);

});

 


12 replies

Userlevel 4
Badge +12

@Ali Ajrouch Your code seems to work for me, please check if you have other CSS HTML applied to the survey anywhere which may be overriding your code.
But still can you try the below code, a modified version of it.

Qualtrics.SurveyEngine.addOnReady(function() {
    /*Place your JavaScript here to run when the page is fully displayed*/

    var placeholderText = 'I am different text';
    jQuery("#"+this.questionId+ " input[type='text']").attr("placeholder", placeholderText);

});
 

Badge +1

thank you @omkarkewat ! i gave it a try but still getting the same results. I have my institution’s style in place but i doubt that’s it. 

Userlevel 4
Badge +12

@Ali Ajrouch There must be something because of which your code isn’t working as it did work at my end. Please try this code in any of your friend’s/colleague’s Qualtrics account who is in the same institution of yours and then we can come to some conclusion.

Badge +1

So i changed the layot to modern from simple layout and the javascript is working now. Isn’t simple layout compatible with custom JS?

Userlevel 4
Badge +12

Yes you are right, I don’t believe that I missed it. It’s mentioned in the support page as well that Simple layout has some limitations.

Try going through this support page.

Badge +1

Thank you very much! It’s weird that they don’t work. Are there any modifications we can do? It’s such a simple script. 

Userlevel 4
Badge +12

Can you try adding the below code in Survey look and feel → Header section , to call a JQuery library.

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

Badge +1

I tried but it didn’t work unfortunetly. Thank you for all the help @omkarkewat, the current product is good enough. 

Userlevel 7
Badge +27

The equivalent code for Simple layout would be:

Qualtrics.SurveyEngine.addOnload(function() {
jQuery("#question-"+this.questionId+" .text-input").attr("placeholder","placeholder text goes here");
});

 

Badge +1

@TomG thank you for the help but didn’t work for me unfortunetly.
 

 

Userlevel 7
Badge +27

 

@TomG thank you for the help but didn’t work for me unfortunetly.

 

It works for me. Therefore, I’m guessing you didn’t load jQuery in the survey header.

Badge +1

Thank you  very very much @TomG . You’re right i had removed the jQuery in the header. I did and it’s working nicely! 

Leave a Reply