Streaming live at 10am (PST)

Disable a checkbox


#1

Hi all,

I would like to disable a checkbox in a form, so that the user cannot check it. Can you please help me?

I tried to uncheck the checkbox automatically when it is clicked with the below custom code but it doesn’t seem to work:

$('.checkbox-disabled').on('click', function(){
if($(this).checked) {
$(this).prop("checked", false);
}
})

I also tried this but with no success neither:

$("#ID-TO-DISABLE").prop(‘disabled’, true);

Thanks in advance for your help!


#2

If you don’t want the user to check a box, then it should either be hidden or disabled.


#3

Sure that it the purpose of my question, can you please indicate me how to disable it? Thank you!


#4

I believe what he meant was try changing the checkbox to: display setting: none in the webflow designer. It’ll be at the top of your styles page.


#5

Thank you for your reply, I need to keep it visible but uncheckable. Do you have any other ideas?


#6

Yes paste this in your page footer code:

<script>
$('.checkbox-disabled').attr('disabled', true);
</script>

Demo: https://jsfiddle.net/samliew/r22Lh70j/


Also, feel free to contact me for further code help and/or customization of third-party plugins


#7

Thank you for your help! There must be something I do wrong as it still doesn’t work.
I have tried to put the code in the page settings (inside tag) and also in an ‘Embed’ component at the bottom of the page but I can still check the checkbox after publishing.
The name of the style applied to the checkbox is ‘checkbox-disabled’ as in the code.


#8

Link to page???


#9

http://test-checkbox-disabled.webflow.io/ (for the checkbox UE 2)


#10

Put it in Page Footer Code. Embed code component is for advanced users only.


#11

I saw your recommendation in your earlier messages, but in the page settings I can only insert code in the head and body tags. Can you please guide me to insert code in the page footer?


#12

Before </body> tag field is the page footer.


#13

Thank you, it works, this was just because I didn’t put the <script></script> tags around the code… :sweat: