readonly attribute is ignored

[guojuan999]

<input type="checkbox" readonly="readonly" id="test"><label for="test">Change</label> $('input').bootstrapSwitch();

The check box should be readonly but if you click the labe; "change" then the check box is updated.

[prathmeshnaik91]

Hi @guojuan999 ,
You need to use disable attribute instead of readonly. Final code block should look like this,

<input type="checkbox" id="test"><label for="test">Change</label> $('#test').bootstrapToggle('disable');

[BikeMrown]

Just some extra info... The above is correct that there is no readonly for checkboxes and that the recommendation is to use disable/enable instead. However, a disabled checkbox will not submit the value on a POST. The best option I have found is to add a second "dummy" property to your viewmodel and use it as your checkbox, set the actual value to a hidden input and have the dummy update the hidden "actual" on flag change and such. The hidden input will always submit on the POST.

[qinjunjerry]

Thanks for the tip of $('#test').bootstrapToggle('disable')
Another easier way to make checkbox readonly is to add to the checkbox:onclick="return false;"