HTML - Por que inputs ignoran el required

 
Vista:
sin imagen de perfil
Val: 6
Ha disminuido su posición en 13 puestos en HTML (en relación al último mes)
Gráfica de HTML

Por que inputs ignoran el required

Publicado por Juan (2 intervenciones) el 11/09/2019 14:28:06
Mi pregunta es la siguiente y no puedo entender dónde está el problema, estoy enviando un formulario con un botón que tiene una identificación, pero el problema es que puede enviar campos vacíos, y necesito que no me dejen enviar campos vacíos. y en cada entrada asigné el "requerido", esto solo funciona si elimino el "id" de mi botón, lo que me permite no tener campos vacíos, pero existe el problema porque con ese id en el botón enviar la información a ajax

1
2
3
4
<div class="modal-footer">
    <button class="btn btn-primary py-1" style="font-size: 14px" id="btnguardar">Guardar datos</button>
    <button type="button" class="btn btn-secondary py-1" style="font-size: 14px" data-dismiss="modal">Cancelar</button>
</div>

Codigo Ajax.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
$(document).ready(function(){
    $('#btnguardar').click(function(){
        var datos=$('#frmpsb').serialize();
        $.ajax({
            type:"POST",
            url:"insertar.php",
            data:datos,
            success:function(r){
                if(r==1){
                }else{
                    alert('Fallo al enviar la peticion.');
                }
            }
        });
    });
});

Esto es lo que yo quisiera mostrar si un campo esta vacio...
wTGIY

Y si lo puedo lograr pero tengo que quitarle el id a mi boton y ese id es el que ocupo para enviar los datos por ajax.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Alejandro
Val: 266
Plata
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Por que inputs ignoran el required

Publicado por Alejandro (70 intervenciones) el 11/09/2019 15:44:01
El require funciona cuando haces el submit del formulario y lo que tu estas haciendo es ejecutar una acción relacionada al evento click del botón.
Te dejo un ejemplo de como puedes hacerlo.
1
2
3
4
5
6
7
8
9
10
<form id="formulario" >
	<input type="text" name="texto" required />
	<button>Enviar</button>
</form>
<script>
document.getElementById('formulario').addEventListener('submit',function(e){
	e.preventDefault();
	// Aquí tu Ajax
});
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
2
Comentar
sin imagen de perfil
Val: 6
Ha disminuido su posición en 13 puestos en HTML (en relación al último mes)
Gráfica de HTML

Por que inputs ignoran el required

Publicado por Juan (2 intervenciones) el 11/09/2019 17:02:07
Lo solucione de esta forma..

1
2
$(document).ready(function(){
		$('#frmpsb').submit(function(){

El puse el submit y el id de el form como en el codigo anterior y al boton le quite el id y solo le puse de type submit y ya funciona correctamente, gracias.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar