Checkbox readonly

#1

Hello is there any solution to do a checkbox readonly and not disable ?

#2

you can put [disabled] = “true” after fill the checkbox

#3

[disabled] = “true” will apply his “grey css” that’s what I would like to avoid…

#4

Have you already tried something like that?

HTML

<form id="aform" name="aform" method="POST">
    <input name="chkBox_1" type="checkbox" checked value="1" readonly />
    <br/>
    <input name="chkBox_2" type="checkbox" value="1" />
    <br/>
    <input id="submitBttn" type="button" value="Submit">
</form>

CSS

input[type="checkbox"][readonly] {
  pointer-events: none;
}
#5

Will give a shot tomorrow

#6

This may break in shadow dom (ionic 4)

Alternative, hacky, way would be to undo the user check action using ionChange event