gitbrent/bootstrap4-toggle

Checkbox value in form on submit

ecrahul46 opened this issue · 3 comments

Dear All,
The checkbox value received when we use this toggle checkbox into the form for on/off type selection, we get only value which is set when active/on and no value is received when deactive/off.

Example code:

Submit

when I submit this form and use "echo $_POST['check'] ;"
I get the "hello" only when i submit with "Online". If I submit with "Offline", no value is received.

Waiting for the reply.

The checked state/value is maintained on your original checkbox element.

<input id="chkToggle1" type="checkbox" data-toggle="toggle">
document.getElementById('chkToggle1').checked // `true` or `false`

But same switching the value on my back-end (PHP) ,it says Undefined index for this input. Whats wrong?

HTML

<div class="form-group col-12 col-lg-12 col-xl-2 my-2 mx-auto">
  <label class="d-block">PRODUTO ATIVO</label>
  <input type="checkbox" name="produto_ativo" id="produto_ativo" data-toggle="toggle" data-size="md" value="true" checked>  
</div>

JS

$('#produto_ativo').change(function() {
  produto_ativo = document.getElementById('produto_ativo').checked;
  document.querySelector("[name='produto_ativo']").value = produto_ativo;
});

Sorry in advance for being a noob. I'm trying to use this to simply pass the value in a form (post) using the 'submit' button. When I remove the 'data-toggle="toggle" from the input line, it works and passes the value. When data-toggle="toggle" is added back, the toggle switch looks and acts right on the page, however, when the form is submitted, it does not pass the value.
I'm sure this is a simple js issue, but I'm not js savvy. Any help is appreciated.

<input type="checkbox" name="disposed" id="disposed" value="YES" data-toggle="toggle" data-on="Include Disposed" data-off="Exclude Disposed" data-size="lg" data-onstyle="success" data-offstyle="dark" />