I have a form to which I enter the personal data, but to give the user a more elegant appearance I have inserted a switch component to 'validate' if that 'character' will be active or inactive, which will be saved as true or false in my mysql database.
The problem would be how to manipulate this component so that when I send the data to my DB it validates if it is true or false and saves it?
The only code I have is this one, since it's where I should start but I don't know how, obviously it's the first time I use it...
<div class="switch">
<label>
Off
<input type="checkbox">
<span class="lever"></span>
On
</label>
</div>
I would appreciate your cooperation.
In order for the backend to receive something, your checkbox has to be in state
checked
and has to have a name . If you don't put an attribute on itvalue
, by default it will send the valueon
when it is checked. But to simplify things, let's set it to 1.When checked, the backend receives 1. When unchecked, the backend receives nothing, as if the checkbox did not exist.
For this reason, the most common technique is to prepend a type input
hidden
with the same name, so that if the checkbox is disabled, that input is responsible for sending a zero, false or off to the backend.This can be tested in the example below. Take into account that in this serialization, the last one that declares the value of a name is the one that counts, so
Equals
Regarding the "component" in reality the switch is nothing more than a cosmetic effect that adds materialize. Your checkbox remains as is, but invisible.
PS: This can obviously be done without jQuery, but materialize itself has jQuery as a dependency.
For a case you enter in the table a value
0
or1
depending on whether it is active or not.Example: