I have a field to select that at the moment of selecting me it returns the data of the users normally but it lets me add a null option in the field people ...
<tr id="campo-select">
<td>
<strong>Personas:</strong>
</td>
<td>
<?php $consulta_listar_usuario = $usuario->listUserpordepartamentodos($conexion, $id_departamento ); ?>
<span id="error-persona">
<select class="browser-default" name="persona0" id="persona0" required>
<option value="0">SELECCIONE A QUIEN NOTIFICAR</option>
<?php while($resultado_listar_usuario = $consulta_listar_usuario->fetch_array(MYSQLI_ASSOC)): ?>
<option value="<?php echo $resultado_listar_usuario['idUsuario'];?>"><?php echo $resultado_listar_usuario['personaNombre'];?> <?php echo $resultado_listar_usuario['apellido'];?> <?php echo $resultado_listar_usuario['email'];?> <?php echo $resultado_listar_usuario['nombreDepartamento'];?></option>
<?php endwhile; ?>
</select>
</span>
<td><button type="button" class="btn" id="suma_persona" ><i class="fa fa-plus" aria-hidden="true"></i></button></td>
<td><button type="button" class="btn" id="borra_persona" ><i class="fa fa-minus" aria-hidden="true"></i></button></td>
<input type="hidden" name="cantidad_persona" id="cantidad_persona">
</td>
</tr>
when I press the button
<td><button type="button" class="btn" id="suma_persona" ><i class="fa fa-plus" aria-hidden="true"></i></button></td>
I added the field SELECT TO WHOM TO NOTIFY in the input as many times as I gave and I do not want to behave like this, any suggestions?
edited, here is my js
$(document).ready(function(){
$( "#suma_persona" ).on('click',function() {
$("#error-persona").append($("#persona0").clone().attr('id', 'persona'+(++c) ));
$("#persona"+c).attr('name', 'persona'+c);
$("#persona"+c).val(0);
$("#cantidad_persona").val(c);
});
$( "#borra_persona" ).on('click',function() {
if(c>0){
$( "#persona"+c ).remove();
c--;
}
});
$("#campo-asunto").hide();
$("#campo-select").hide();
$( "#informar" ).click(function() {
if($("#informar").is(':checked')){
$("#campo-asunto").show();
$("#campo-select").show();
}
else{
$("#campo-asunto").hide();
$("#campo-select").hide();
}
});
});