Require to mark at least 1 checkbox

Asked

Viewed 1,303 times

4

I have a table that in each row has two checkbox options, yes and no, as shown in the image:

inserir a descrição da imagem aqui

Code to mount the table:

$y = 0;
while($rows_cursos = mysqli_fetch_array($resultado_cursos)) {

$tabela1 .= '<tr>';

$tabela1 .= '<td> <input type="text" readonly="true" size="20" name= "Produto['.$y.']" id= "Produto" value="'.$rows_cursos['Descricao'].'"></td>';

$tabela1 .= '<td style="float:center"> <input type="checkbox" name= "Sim['.$y.']">';

$tabela1 .= '<td style="float:center"> <input type="checkbox" name= "Nao['.$y.']">';

$tabela1 .= '<td> <textarea type="text" id="Observacao" name="Observacao['.$y.']" rows="2" cols="30"></textarea>';

$tabela1 .= '</tr>'; 
$y++;
}

I wanted to force to fill one of the checkboxes in each line and if one of the checkboxes was not filled, to show a warning that a line is missing.

  • 2

    Pq does not make it easier, only with a checkbox, if the checkbox is marked, send yes, if it is not marked send no ?

  • Scupe there, this table goes inside a form ? because if it is, Html5 already has the required attribute. where you force the fill before Submit.

  • @Scratchy and Doodle, it doesn’t go inside a form, it’s inside a div.

  • @Maikeaerosmith, but I want to fill a checkbox being yes or no and force the completion of one of them, because otherwise there may be an oblivion to filling and there may even be the product and register as there is no.

  • 1

    @Beginner should be able to check only one option? If you can check only "yes" or "no", use radio button in place of checkbox with the required attribute is much easier and functional.

  • 2

    You can create the table within a form tag, and put required in the radio button sets

  • 1

    the most indicated option, is our friend @Renan posted.

Show 2 more comments

2 answers

10


You can change the type of the checkbox for radio and include the attribute required to make it mandatory:

<form>
  <div>
    <label for='sabonete-liquido'>Sabonete Líquido</label>
    <input type='radio' name='sabonete' value='y' required id='sabonete-liquido'>
    <input type='radio' name='sabonete' value='n'>
  </div>
  <div>
    <label for='locao-corporal'>Loção Corporal</label>
    <input type='radio' name='locao-corporal' value='y' required id='locao-corporal'>
    <input type='radio' name='locao-corporal' value='n'>
  </div>
  <div>
    <label for='po-de-talco'>Pó de Talco</label>
    <input type='radio' name='po-de-talco' value='y' required id='po-de-talco'>
    <input type='radio' name='po-de-talco' value='n'>
  </div>

  <!-- ... -->

  <button type='submit'>Enviar</button>
</form>

  • 2

    +1 Good answer. Simple and uses HTML for what is done.

4

The @Renan answer easily solves what you want, but I would like to add by citing problems in your code:

First of all do what has been suggested: change checkbox for radio. You should only use checkbox when it is multiple choice. When you can only choose 1 option, you should use radio.

1. Repetition of id’s

When making the loop while will repeat the id= "Produto" on each line, this is incorrect because an id must be unique. Swap for class: class= "Produto". Is also repeating another id: id="Observacao". Exchange for class="Observacao".

2. Names and values of radios

Options of radio must have the same name. You should wear the same name on each radiobutton pair of each line and assign to each of the pair a value that will differentiate the option.

For example, the "yes" radio can receive the value of s and that of "no" the value of n, and the name can be produto:

<input type="radio" name= "produto['.$y.']" value="s" required>
<input type="radio" name= "produto['.$y.']" value="n">

And finally, you must close the <td> table, such as this row:

                                                                                   ↓↓↓
$tabela1 .= '<td style="float:center"> <input type="checkbox" name= "Sim['.$y.']"></td>';
  • thanks, I have corrected the errors of my code and solved with Renan’s reply

  • Blz! If you found the answer helpful, you can vote if you like. Abs!

  • @Beginner OK!,,

Browser other questions tagged

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