Accessing open text field with auto-complete turned on | XM Community
Skip to main content

I’m currently using the new auto-complete feature in connection with an open text box. In my setting, participants report their supervisors name which is then encrypted and the original inputs are deleted afterwards using the script from this thread

Because I cannot risk having typos, participants need to pick the name from a list, instead of a free text entry. As each organization has more than 100+ supervisors, turning on auto-complete is good compromise.  

 

If I just use the regular text box without auto-complete, everything works fine. However, if I turn on the auto-complete feature, my javascript the name, but is not able to permanently change it. I suppose I need to access the field in a different way, but I’m not sure how.

 

This is the code I’m currently using:

Qualtrics.SurveyEngine.addOnReady(function() {
    var questionId = this.questionId;
    var textEntryField = document.querySelector('#' + questionId + ' input');

    // Get the embedded data variable DELETE
    var deleteValue = Qualtrics.SurveyEngine.getEmbeddedData('DELETE');

    // Check if the embedded data variable DELETE is equal to true
    if (deleteValue === 'TRUE') {
        // Replace the value
        textEntryField.value = 'THIS NAME WAS REMOVED';

        // Click the next button
        var nextButton = document.querySelector('#NextButton');
        if (nextButton) {
            nextButton.click();
        }
    }
});

 

Happy for any advice!

Hi @LeoGr 

mabey it will work with a different code


To address this, you can try a different approach to ensure that your script works reliably with the auto-complete feature. One option is to listen for changes to the input field and react accordingly. Here's how you can modify your code to achieve this:

 

Qualtrics.SurveyEngine.addOnReady(function() {

    var questionId = this.questionId;

    var textEntryField = document.querySelector('#' + questionId + ' input');

    // Get the embedded data variable DELETE

    var deleteValue = Qualtrics.SurveyEngine.getEmbeddedData('DELETE');

    // Function to replace supervisor's name

    function replaceSupervisorName() {

        // Check if the embedded data variable DELETE is equal to true

        if (deleteValue === 'TRUE') {

            // Replace the value

            textEntryField.value = 'THIS NAME WAS REMOVED';

        }

    }

    // Call the function initially

    replaceSupervisorName();

    // Listen for changes to the input field

    textEntryField.addEventListener('input', replaceSupervisorName);

    // Click the next button

    var nextButton = document.querySelector('#NextButton');

    if (nextButton) {

        nextButton.click();

    }

});



This code adds an event listener to the input field that triggers the replaceSupervisorName() function whenever the input field's value changes. This should ensure that even if the auto-complete feature modifies the input field, your script will still replace the supervisor's name as intended.


Leave a Reply