How to remove a radio button for the text entry within multiple choice question and keep the radio buttons for the other options

Hi ​@Makgomes ,

For hiding the label, add JavaScript to your question.

Qualtrics.SurveyEngine.addOnload(function()
{
	/*Change this WORD to the choice text above the text entry*/
	/*jQuery("#" + this.questionId + " label:contains('WORD')").hide();*/
	var qid = this.questionId;
	jQuery("#" + qid + " label:contains('WORD')").hide();
	jQuery("#" + qid + " input[type='text']").removeAttr("title");
});

Note: it searches for label that contain the term, so it may hide other choices if other choices contain the same term.

However, there will be an error message (You have added text into an unselected answer choice. Please select the answer choice or remove the text.) if the text entry is not cleared and another choice is selected.

I am unsure on how to clear the text entry to make it exclusive.

Thank you. That worked!

I added additional code so that when someone starts typing in the box, it deselects the other options. However, if I write something in the box and then select another response (e.g., “don’t know), the text remains.

Is there a way to program the question so the text deletes if another option (e.g., “don’t know”) is chosen after someone writes in the box? If people write in the box and then click another option, they get an error (i.e., qualtrics doesn’t allow it) , but I rather have it so that the text is deleted to avoid confusion. 

This is the code:

Qualtrics.SurveyEngine.addOnload(function() {
    /* 'postal_code' is the hidden keyword for Qualtrics to know which option to hide the radio button. 
       Whatever text you put before the text entry is what you should put here. The text will be hidden in preview */
    jQuery("#" + this.questionId + " label:contains('Postal_code')").hide();
});

Qualtrics.SurveyEngine.addOnload(function() {
    // Get the text entry field
    var textEntryField = document.querySelector('input[type="text"]');
    
    // Ensure the text entry field exists
    if (textEntryField) {
        // Adjust the size using inline styles
        textEntryField.setAttribute("style", "width: 100px; height: 30px;"); // Set width and height
    }

    // Get the radio buttons for the other two responses
    var radioButtons = document.querySelectorAll('input[type="radio"]');
    
    // Add an event listener to the text entry field
    textEntryField.addEventListener('input', function() {
        // Loop through the radio buttons and uncheck them
        radioButtons.forEach(function(radioButton) {
            radioButton.checked = false;
        });
    });
});

This is what I am trying to avoid:

Hi ​@Makgomes ,

With ChatGPT’s help and some trial and error,

Qualtrics.SurveyEngine.addOnload(function() {
    var qid = this.questionId;

    // Hide the label containing 'Postal_code'
    jQuery("#" + qid + " label:contains('Postal_code')").hide();

    // Get the text entry field
    var textEntryField = document.querySelector("#" + qid + " input[type='text']");

    // Get all radio buttons
    var radioButtons = document.querySelectorAll("#" + qid + " input[type='radio']");

    // When user types in the text field, uncheck all radio buttons
    if (textEntryField) {
        // Adjust the size using inline styles
        textEntryField.setAttribute("style", "width: 100px; height: 30px;"); // Set width and height
        textEntryField.addEventListener('input', function() {
            radioButtons.forEach(function(radioButton) {
                radioButton.checked = false;
            });
        });
    }

    // When any radio button is selected, clear the text field
    radioButtons.forEach(function(radioButton) {
        radioButton.addEventListener('change', function() {
            if (textEntryField) {
                textEntryField.value = '';
            }
        });
    });
});

It works! Thank you again!!