How to create dynamic checkbox?

Asked

Viewed 230 times

0

I am using the following commands to create the checkbox

 if (isset($finded_documents)) {
                      // inicia a variável que vai guardar os checkboxes
                      $checkboxes = '';

                      // para cada documento encontrado
                      foreach ($finded_documents as $check) {
                        // acrescenta um Checkbox
                        $checkboxes .= '<div class="custom-control custom-checkbox">'
                          . "<input id='check-$check[id]' type='checkbox' value='$check[id]' name='docs[]' class='custom-control-input'> "
                          . "<label class='custom-control-label' for='check-$check[id]'>$check[Nome_Documento]</label>"
                          . '</div>';

                      }
                      // mostra os $checkboxes na tela
                      echo $checkboxes;
                    }

                  ?>

I wish that when I clicked on a checkbox, I would add this command line:

<input type="date" name="data" placeholder="Digite a data do Vencimento"
                           class="form-control"><br>
  • You could not leave the already created date input hidden, and then display it as one of the checkbox is checked?

1 answer

0

You can do this way using pure JS:

HTML:

  <input type="checkbox" id="id_checkbox">
  <p>Digite a data:</p>
  <input id="id_data" name="data" placeholder="Digite a data do Vencimento" type="hidden">


JS:

document.getElementById('id_checkbox').addEventListener('change', function() {
  if(this.checked) {
    document.getElementById('id_data').removeAttribute('type', 'hidden');
    document.getElementById('id_data').setAttribute('type', 'date')
  } else
    document.getElementById('id_data').setAttribute('type', 'hidden'); 
});

I hope you get what you need.

  • meets more or less bro, this script works with certain checkbox ja, and not equal to my code, where checkboxes are generated depending on the quantity registered.

  • @Nattanafonso, you can enter the checkbox id automatically as they are created, simply name the checkbox id, and place the variable within the parentheses of the document.getElementById(var). If there are many, put their name in an array, and refer to the position of the array iterating over it. If you want to edit an example for you.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.