Adding a checkbox to a Text/Graphic?

I would just add a checkbox after as a separate question.

No one who might know how to solve this?
Seems other people here have used java script and changed the opacity of a setting but I don't know where to apply these changes, and as you know: Qualtrics Support do not support custom code changes, so I'm totally in the dark here.

MattiasM I am looking at what you are trying to do and a few things come to mind.
You mention that it is a Text/Graphic question, but your display looks more like a Text Entry question with the Text Type being Essay Text Box.
If that is the case, then I would simply recommend that you create a question following the Essay Text Box question you already have, and set the Display Logic to be that if the Essay Text Box is NOT Empty then to Display (and in the display login screen check off the "In Page" check box on the bottom left to have it show directly below the original Essay Text Box question).
This would result in the checkbox popping up, only if someone actually enters data in that Essay Text Box and it would look like it is part of the original question (same page).
Now to get the checkbox popping up displayed as you would like. You can set that question up as a Multiple Choice, then reduce it to Number of Choices = 1, but also switch to Answer Type = Allow Multiple Choices (this changes it from a radio button to a checkbox). Now, I haven't found a way to get the question text to disappear completely (I wish there was a way), but I have found that you can put a "." and in the Rich Content Editor you can make the "." the same colour as your background. Also, make sure the checkbox is NOT mandatory.
This should achieve everything you want, without having to worry about programming and finding ways around things, while collecting the results of the checkbox responses directly into the dataset results from your survey.
Hope that helps!
PS - You actually don't need to use the Display Logic if you want the question to pop-up regardless of data being entered in the Essay Text Box. You just need to follow the part about setting up the follow-up question and you will get it the way you want.

https://community.qualtrics.com/XMcommunity/discussion/comment/45227#Comment_45227I totally agree with jasonkelly. However if you have chosen the classic layout and want a checkbox with html code and js would do the job of having a "real" checkbox . What I have forgot to mention is that you need to add a text/graphic node below your text entry question and don't add a page break :-)

https://community.qualtrics.com/XMcommunity/discussion/comment/45227#Comment_45227Thanks for the awesome explanation jasonkelly !
I should probably have mentioned that the company standard Theme we use is the "Classic" layout, which is the main reason why this is not working the way I want it. But using your setup it would work, but we'd have to revert to the "Flat" Theme. But seeing how much of an issue this seems to be, I'm almost leaning towards moving to that Theme instead, haha.
Thanks for the input, much appreciated!
Best regards
-Mattias

https://community.qualtrics.com/XMcommunity/discussion/comment/45222#Comment_45222Hello again and thanks for this Rudi !
This actually produce the checkbox with the "I consent" next to it.
But how do I manage where it appears? At the moment it shows on all pages across all blocks.
Also, I can't seem to capture if someone checks the box or not. I tried to set the value in the Survey Flow but it comes back with the value regardless of it being checked or not.
Also, not sure I understand what you meant with the text/Graphic node. What is that supposed to do?
Thanks again
-Mattias

Hi,
this is the setup I had in mind:

looks like this:
the HTML "code" goes into the text graphic question

Best regards

Rudi

answer to your second question:
dealing with the javaScript

your survey flow would look like this:
mind the embedded data needs to be set before the question where the javaScript is. Ideally right in the beginning

the java script goes here where is. add a page break for testing if the embedded data field is set correctly


the java script:

Qualtrics.SurveyEngine.addOnPageSubmit(function(type)

{
let consent = document.getElementById('consent') // mind Id is case sensitive, hence make sure the spelling is identical with the spelling in the html

if (consent.checked == true){

Qualtrics.SurveyEngine.setEmbeddedData("consent",1) // define consent in the survey flow and use it for whatever you want to do withit

}
});

Hope this answers your question

Best regards

Rudi

https://community.qualtrics.com/XMcommunity/discussion/comment/45297#Comment_45297Wow! Truly amazing instructions, thanks so much!!
The only thing I can't get to work is to see the output of "1" when the checkbox is checked.
In my survey the "test" just looks like this:
Also in the export of the survey details the "consent" is blank.

Again, thanks for being super clear with where to place everything. I had placed the JS in the wrong place. :)
Thanks in advance
-Mattias

https://community.qualtrics.com/XMcommunity/discussion/comment/45299#Comment_45299When I "view" the response in the Data & Analysis, it looks like the box is unchecked...

Hi there,

have you checked that the id in the HTML is spelled consent and not Consent? Maybe you could post your version of the html and javascript. Thus, I might be able to spot where things go wrong


Best regards

Rudi

https://community.qualtrics.com/XMcommunity/discussion/comment/45301#Comment_45301Ok, thanks. So how can I track that? I need like a 1/0 (or rather 1/blank) for checked/unchecked response so I can take action accordingly.

Thanks again and sorry for being a total noob here :)

https://community.qualtrics.com/XMcommunity/discussion/comment/45303#Comment_45303SUCCESS!!!!!! yeah it was spelled with a capital "C" in the HTML, but updated now and it's WORKING!!!!!
Thanks SOOOO much, and I actually could read your scribbles. Says a lot about my own "offline" hand writing, hahaha!
Have a fantastic rest of your day!!!!
-Mattias

Hello and goodday from a sunny Sweden!
Rudi - Do you know if it's possible to add display logic to the above js code? So if the box is checked another question/text area becomes visible?
Thanks in advance
-Mattias

Helle MattiasM,
nothing you can't do ;-)

the question set up would look like this:


the code would be:

Qualtrics.SurveyEngine.addOnReady(function()
{
let qo = document.getElementsByClassName('QuestionOuter') // get the question containers on the pages
let te = document.getElementsByClassName('InputText') // get the text entry fields
qo[qo.length-1].hide() //hide the last one when page is ready
//get the click element
this.questionclick = function(event,element)

  {
    
    console.log(event, element);
    if (element.id == 'consent')
{
//if checkbox is checked show the text entry question
if(element.checked == true){
qo[qo.length-1].show()
//if checkbox is unchecked hide the text entry question
}else{
qo[qo.length-1].hide()
te[te.length-1].value = ''// delete the entered text when unchecked

}

}
          
}   

  

});

Qualtrics.SurveyEngine.addOnPageSubmit(function(type)

{

let consent = document.getElementById('consent')

let te = document.getElementsByClassName('InputText')



if (consent.checked == true){



Qualtrics.SurveyEngine.setEmbeddedData("consent",1) // define consent in the survey flow and use it for whatever you want to do withit

}else{
te[te.length-1].value = ''// make sure that the entered text is deleted when consent is unchecked

}



});
Best regards

Rudi

https://community.qualtrics.com/XMcommunity/discussion/comment/45445#Comment_45445WOW!
That does it. I'm SO learning Java Script from here on! Again, thanks a million!!!!!
Have a wonderful day!
Best regards
-Mattias

Hi all,

Thanks for this amazing guide! I used it to implement a checkbox in a Text/Graphic question type like in the example of MattiasM.
In our project, we generate a personalized report based on the respondent responses. We like to apply the "force response" function on the checkbox question such that respondents must agree with the privacy policy of our website.
Any ideas on how to apply a force response on Text/Graphic question type?
Thanks,
Hadar

Sorry to ask again Rudi , but when I translate the survey to other languages, the checkbox disappears... For example in German, where the text is set the "normal" way.
I can understand this is de to a conflict with the HTML code being in English, but is there a way to "call on" the text in the translations and still keep the checkbox?
Have a nice Friday and a wonderful weekend!
-Mattias

Hi Matthias,

you need to add the checkbox HTML code into the translations as well :-)

Best regards

Rudi

https://community.qualtrics.com/XMcommunity/discussion/comment/45734#Comment_45734Haha, omg. I have not seen that little HTML button in the translation section. But yes, that surely solved it. Thanks AGAIN! :)
All the best
-Mattias

https://community.qualtrics.com/XMcommunity/discussion/comment/45609#Comment_45609Hi @hadard,
In my opinion, you shouldn't force the respondent to tick a box if there is only one :-) because the respondent wouldn't have a choice but to tick the box if s/he wants to progress in the survey.
from your description, I take it, that you want to deliver the report if the respondent has checked the checkbox. As you store the result in an embedded data field you can base a condition on it.
send the report if consent == 1
If you don't want people who don't consent to take part in the survey, simply screen them out

Best regards

Rudi

Hi Rudi ,
Thanks :) We've eventually decided to discard this question.
Best,
Hadar