Multi-language placeholder text for text entry questions (Javascript) | XM Community
Skip to main content

Hi! I came up with some Javascript code to to set the placeholder text for text entry questions based on the language code of the survey. 

Right now, it's set to look at the language code in Q-Language. I made 3 translations, and in all other cases the placeholder text should be Dutch.

It works, but I'm a beginner in JS and I can't predict potential future issues. I would appreciate some feedback!

Qualtrics.SurveyEngine.addOnReady(function() {
    var placeholderText = "";

    // Get the language code from the survey object
    var Q_Language = Qualtrics.SurveyEngine.getEmbeddedData('Q_Language');

    // Set the placeholder text based on the language code
    if (Q_Language === "EN") {
        placeholderText = "Please note: your answers will be taken literally and processed in the report.";
    } else if (Q_Language === "DE") {
        placeholderText = "Bitte beachten Sie: Ihre Antworten werden wörtlich übernommen und im Bericht verarbeitet.";
    } else if (Q_Language === "FR") {
        placeholderText = "Veuillez noter que vos réponses seront prises littéralement et traitées dans le rapport.";
    } else {
        placeholderText = "Let op; uw antwoorden worden letterlijk overgenomen en in de rapportage verwerkt.";
    }

    // Set the placeholder text for the text entry questions
    jQuery("#" + this.questionId + " .InputText, .TextEntryBox").attr("placeholder", placeholderText);
});

See also: Adding warning to text entry box | XM Community (qualtrics.com)

Great work! 

I don't see any issues as such. 

This should work, I don’t see any issues.

In case you would like to add placeholder to all questions in the survey, you can add the below script to header section:

<script>Qualtrics.SurveyEngine.addOnReady(function()
{
    let lang = "${e://Field/Q_Language}", placeholder_text;

    switch (lang) {
        case "FR":
            placeholder_text = "Ecrire ici...";
            break;
        case "EN-GB":
            placeholder_text = "Tap here...";
            break;

        default:
            placeholder_text = "Tap here...";
    }
    jQuery(".InputText").attr('placeholder',placeholder_text);
});
</script>

 

This should work, I don’t see any issues.

In case you would like to add placeholder to all questions in the survey, you can add the below script to header section:

<script>Qualtrics.SurveyEngine.addOnReady(function()
{
    let lang = "${e://Field/Q_Language}", placeholder_text;

    switch (lang) {
        case "FR":
            placeholder_text = "Ecrire ici...";
            break;
        case "EN-GB":
            placeholder_text = "Tap here...";
            break;

        default:
            placeholder_text = "Tap here...";
    }
    jQuery(".InputText").attr('placeholder',placeholder_text);
});
</script>

 

Great tip @Sowrabh1993, thanks! Do you know if adding the JS to each question individually affects the loading speed of the survey page? Does adding this script to the header section improve overall performance (besides being convenient)?

Leave a Reply


Terms & Conditions