I have a styled html checkbox that sets some bools on a admin page. On hitting the "Save" button I want to get the states / values of the checkbox en update the database.
Now I know that I can add rutan="server" to the control but for some reason that breaks the css and the Checkbox can't be checked anymore.
So what would be the way to get the value here? Or whats the best practice?
This is a webforms app.
switch(css / html):
.cmn-toggle {
position: absolute;
margin-left: -9999px;
visibility: hidden;
}
.cmn-toggle + label {
display: block;
position: relative;
cursor: pointer;
outline: none;
user-select: none;
}
input.cmn-toggle-round + label {
padding: 2px;
width: 40px;
height: 20px;
background-color: #dddddd;
border-radius: 60px;
}
input.cmn-toggle-round + label:before,
input.cmn-toggle-round + label:after {
display: block;
position: absolute;
top: 1px;
left: 1px;
bottom: 1px;
content: "";
}
input.cmn-toggle-round + label:before {
right: 1px;
background-color: #f1f1f1;
border-radius: 60px;
transition: background 0.4s;
}
input.cmn-toggle-round + label:after {
width: 19px;
background-color: #fff;
border-radius: 100%;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
transition: margin 0.4s;
}
input.cmn-toggle-round:checked + label:before {
background-color: #8ce196;
}
input.cmn-toggle-round:checked + label:after {
margin-left: 20px;
}
.switch-align {
margin-top: 5px;
}
<input id="switchAdmin" class="cmn-toggle cmn-toggle-round" type="checkbox" />
<label for="switchAdmin"></label>
Aucun commentaire:
Enregistrer un commentaire