Foros del Web » Creando para Internet » HTML »

[SOLUCIONADO] Button obligatorio error

 Estas en el tema de Button obligatorio error en el foro de HTML en Foros del Web. Buenas, Tengo un formulario web en el q quiero que algunos campos del tipo texto sean obligatorios. No he tenido problema alguno en hacerlo, pero ...
  #1 (permalink)  
Antiguo 28/12/2014, 08:35
Avatar de maiksix  
Fecha de Ingreso: noviembre-2014
Ubicación: Sabadell
Mensajes: 124
Antigüedad: 10 años
Puntos: 1
Button obligatorio error
Buenas,

Tengo un formulario web en el q quiero que algunos campos del tipo texto sean obligatorios. No he tenido problema alguno en hacerlo, pero al llegar a una casilla del tipo "button" no me acepta el formulario. Es decir, cuando le doy a submit no acepta el formulario pero tampoco manda el mensaje de que hay campos obligatorios vacíos.

En la función de JavaScript tengo la siguiente condición

Document.formulario.acepto_condiciones.value != "acepto"

Por otro lado tengo definido el botón como:
Type=button
Value="acepto"
Name=acepto_condiciones

Alguien puede indicarme cual es el error o de que manera puedo hacerlo?

Muchas gracias
__________________
Going hard for too long... Can't get enough
  #2 (permalink)  
Antiguo 28/12/2014, 10:10
Avatar de mbm150  
Fecha de Ingreso: enero-2013
Ubicación: Muskiz
Mensajes: 79
Antigüedad: 11 años, 10 meses
Puntos: 21
Respuesta: Button obligatorio error
Hola

No se si he entendido bien el problema que tienes, pero el input tipo button no acepta required, así que nunca aparecerá el mensaje del navegador dando error.

Tampoco entiendo lo de que compruebes el valor, el input button es un botón como su nombre indica, por lo que el valor nunca cambia. Tu javascript esta mal, ya que la expresión que has puesto siempre es falsa. Pero como te digo, no es necesario ponerla.

Tal vez lo que tienes que utilizar es un input tipo radio o checkbox.

Saludos.
  #3 (permalink)  
Antiguo 29/12/2014, 09:04
Avatar de maiksix  
Fecha de Ingreso: noviembre-2014
Ubicación: Sabadell
Mensajes: 124
Antigüedad: 10 años
Puntos: 1
Respuesta: Button obligatorio error
Hola mbm150, gracias por tu respuesta, me has ayudado con otra duda que tenia, pero sigo sin poder hacer que sea obligatorio el aceptar condiciones.

Los campos de type="text" son obligatorios pero los radio no...

lo tengo definido así:

<br><b>Acepto las condiciones</b>:<input style="margin-left:15px;" size="40" type="radio" name="Condiciones" value="acepto" required><br>

Es correcto, como puedo hacer que sea obligatorio?

Gracias y un saludo.
__________________
Going hard for too long... Can't get enough
  #4 (permalink)  
Antiguo 30/12/2014, 07:31
Avatar de GeekGirl  
Fecha de Ingreso: julio-2014
Mensajes: 423
Antigüedad: 10 años, 4 meses
Puntos: 44
Respuesta: Button obligatorio error
Te equivocas, un input de tipo radio puede ponerse como requerido tranquilamente.
Es más, acabo de probar tu codigo y funciona. Tenés ese input dentro de un formulario verdad? Probá de esta manera:

Código HTML:
 <form action="#" method="post">
    <br /><b>Acepto las condiciones</b>:<input style="margin-left:15px;" size="40" type="radio" name="Condiciones" value="acepto" required><br />
    <input type="submit" value="Enviar" />
  </form>
Saludos :)
  #5 (permalink)  
Antiguo 30/12/2014, 09:59
Avatar de maiksix  
Fecha de Ingreso: noviembre-2014
Ubicación: Sabadell
Mensajes: 124
Antigüedad: 10 años
Puntos: 1
Respuesta: Button obligatorio error
Hola GeekGirl,

Gracias por tu ayuda, he probado y sigue sin funcionar, el código que tengo es:

Código HTML:
<form name="formulario" method="post" action="hola.php" enctype="multipart/form-data">
       <table>
        <td>
            <tr>
            <br><p align="justify">texto texto texto<br><br>
            
            texto texto texto
            </p>
            </tr>
            <tr>
            <br><b>Acepto las condiciones</b>:<input style="margin-left:15px;"  size="40" type="radio" name="Condiciones" value="acepto" required><br>
            </tr>
       </td>
       </table>
        
</font>
    
           <input style="margin-left:15px;" type="submit" value="Enviar"></input style="margin-left:15px;">                                                
        
	
</form>
</body>
La verdad que no he visto diferencia con lo que has propuesto, así que no entiendo a que se puede deber el fallo, pero hago la prueba y no me da ningún error, simplemente me redirecciona a la siguiente pagina sin salir ningún mensaje de error...

A ver si es alguna tontería que me dejo...

Muchas gracias y un saludo! :)
__________________
Going hard for too long... Can't get enough
  #6 (permalink)  
Antiguo 30/12/2014, 13:18
Avatar de GeekGirl  
Fecha de Ingreso: julio-2014
Mensajes: 423
Antigüedad: 10 años, 4 meses
Puntos: 44
Respuesta: Button obligatorio error
Copié y pegué tu código y funciona bien. Qué navegador usás?
  #7 (permalink)  
Antiguo 30/12/2014, 15:14
Avatar de maiksix  
Fecha de Ingreso: noviembre-2014
Ubicación: Sabadell
Mensajes: 124
Antigüedad: 10 años
Puntos: 1
Respuesta: Button obligatorio error
Ahora si que funciona pero solo en chrome... en mi navegador habitual-> Safari versión 8.0 sigue sin funcionar, como puedo corregir esto? Porque es para un formulario y no puede fallar en ningún momento, sino puedo tener problemas legales en el proyecto...

Alguna idea?

Gracias y un saludo!
__________________
Going hard for too long... Can't get enough
  #8 (permalink)  
Antiguo 31/12/2014, 02:49
 
Fecha de Ingreso: diciembre-2014
Mensajes: 111
Antigüedad: 9 años, 11 meses
Puntos: 9
Respuesta: Button obligatorio error
Yo, que soy algo radical, pondría una redirección automática a un aviso con los navegadores soportados si intentas meterte al formulario desde un navegador no soportado y desde el aviso referencias a las páginas de descarga de esos navegadores, legalmente estarías más que cubierto y al resto de programadores web nos haces un favor.
  #9 (permalink)  
Antiguo 31/12/2014, 06:36
Avatar de maiksix  
Fecha de Ingreso: noviembre-2014
Ubicación: Sabadell
Mensajes: 124
Antigüedad: 10 años
Puntos: 1
Respuesta: Button obligatorio error
Hola Sarlit,

me gusta tu idea, y tienes toda la razón pero por cosas del proyecto y el usuario de la web me es imposible hacer eso, porque estaría poniendo muchas trabas...

No se si hay alguna otra solución, más tarde subiré el código javascript con el que lo había hecho y que casi funciona del todo... A ver si alguno me puede echar una mano corrigiendo el fallo

Gracias ;)
__________________
Going hard for too long... Can't get enough
  #10 (permalink)  
Antiguo 31/12/2014, 09:11
Avatar de GeekGirl  
Fecha de Ingreso: julio-2014
Mensajes: 423
Antigüedad: 10 años, 4 meses
Puntos: 44
Respuesta: Button obligatorio error
Como podés ver en esta grilla, el atributo required no es soportado en ninguna versión de Safari.

No tenés más opción que validarlo con javascript o con alguna forma de programación.

Saludos
  #11 (permalink)  
Antiguo 01/01/2015, 06:35
Avatar de maiksix  
Fecha de Ingreso: noviembre-2014
Ubicación: Sabadell
Mensajes: 124
Antigüedad: 10 años
Puntos: 1
Respuesta: Button obligatorio error
Muchas gracias!

El problema es que el código javascript que tenia no funciona...

El formulario requiere que sea rellenado al completo, tanto los textos, como las condiciones aceptadas como la imagen... Os dejo la definición del input de las condiciones y las del tipo radio que son las que fallan, también pongo la de la imagen:

Código: 
<table style="width:1024">

                <tr style="width:auto; height:50px;border: black 0px solid;"><input style="margin-top:-25px; margin-right:30px;" size="40" type="radio" name="Carrera" value="1" ><font size='6'; font color='white'><b>1  -  16/17 de mayo </b></font></tr> <br><br>
                <tr style="width:auto; height:50px;border: black 0px solid;"><input style="margin-top:-25px; margin-right:30px;"  size="40" type="radio" name="Carrera" value="2" ><font size='6'; font color='white'><b>2  -  04/05 de julio  </b></font></tr><br><br>
                <tr style="width:auto; height:50px;border: black 0px solid;"><input style="margin-top:-25px; margin-right:30px;"  size="40" type="radio" name="Carrera" value="3" ><font size='6'; font color='white'><b>3  -  05/06 de setiembre  </b></font></tr><br><br>
                <tr style="width:auto; height:50px;border: black 0px solid;"><input style="margin-top:-25px; margin-right:30px;"  size="40" type="radio" name="Carrera" value="4" ><font size='6'; font color='white'><b>4  -  10/11 de octubre  </b></font></tr>
        </table>
        <div style="background:#C0C0C0; margin-left:-210px;margin-top:-150px;width:1450px; height:5px "></div>
        <center>
        <table style="width:1024">

                <td style="width:auto; height:50px;border: black 0px solid;"><center><font size='6'; font color='white'><br><b>A</b></center><br><center><input style="margin-top:-20px;" size="40" type="radio" name="Categoria" value="1" ></center><br></font></td> 
                <td style="width:auto; height:50px;border: black 0px solid;"><center><font size='6'; font color='white'><br><b>C</b></center><br><center><input style="margin-top:-20px;"  size="40" type="radio" name="Categoria" value="2" ></center><br></font></td>
                <td style="width:auto; height:50px;border: black 0px solid;"><center><font size='6'; font color='white'><br><b>J</b></center><br><center><input style="margin-top:-20px;"  size="40" type="radio" name="Categoria" value="3" ></center><br></font></td>
                <td style="width:auto; height:50px;border: black 0px solid;"><center><font size='6'; font color='white'><br><b>S1</b></center><br><center><input style="margin-top:-20px;"  size="40" type="radio" name="Categoria" value="4" ></center><br></font></td>
                <td style="width:auto; height:50px;border: black 0px solid;"><center><font size='6'; font color='white'><br><b>S</b></center><br><center><input style="margin-top:-20px;" size="40" type="radio" name="Categoria" value="5" ></center><br></font></td>
        </table>

<tr>
            <b>Comprobante</b>:<br><input type="hidden" name="MAX_FILE_SIZE" value="4194304"  />
	<div id="imagen1"><input name="imagen1" type="file"/><br></div>
            </tr>
            <tr>
            <br><b>Acepto las condiciones</b>:<input style="margin-left:15px;"  size="40" type="radio" name="Condiciones" value="acepto" ><br>
            </tr>

<input style="margin-left:15px;" type="submit" onclick="verifica()" value="Enviar"></input style="margin-left:15px;">
El javascript de alerta es este: (creo que el error esta en la parte en rojo, porque si quito esas lineas me salta el aviso...)

Código: 
<script language="JavaScript" type="text/javascript">
            function verifica() {
            if ((document.formulario.Categoria.value = "1" OR document.formulario.Categoria.value = "2" OR document.formulario.Categoria.value = "3" OR document.formulario.Categoria.value = "4" OR document.formulario.Categoria.value = "5" )
            (document.formulario.Carrera.value = "1" OR document.formulario.Carrera.value = "2" OR document.formulario.Carrera.value = "3" OR document.formulario.Carrera.value = "4" )
            && document.formulario.Concursante_Colectivo.value != "" && document.formulario.Representante.value != "" && document.formulario.Concursante_Individual.value != ""
            && document.formulario.Nif_Concursante.value != "" && document.formulario.Licencia_Concursante.value != "" && document.formulario.Licenciacopia_Concursante.value != "" 
            && document.formulario.Email_Concursante.value != "" && document.formulario.Direccion_Concursante.value != "" && document.formulario.Numero_Concursante.value != ""
            && document.formulario.CPConcursante.value != "" && document.formulario.Poblacion_Concursante.value != "" && document.formulario.Provincia_Concursante.value != "" 
            && document.formulario.Pais_Concursante.value != "" && document.formulario.Movil_Concursante.value != "" && document.formulario.Fijo_Concursante.value != "" 
            && document.formulario.Fax_Concursante.value != "" && document.formulario.Nombre_Piloto.value != "" && document.formulario.Apellido_Piloto.value != "" 
            && document.formulario.OtroApellido_Piloto.value != "" && document.formulario.Nif_Piloto.value != "" && document.formulario.Licencia_Piloto.value != "" 
            && document.formulario.Licenciacopia_Piloto.value != "" && document.formulario.Fecha_Piloto.value != "" && document.formulario.Email_Piloto.value != "" 
            && document.formulario.Direccion_Piloto.value != "" && document.formulario.Numero_Piloto.value != "" && document.formulario.CPPiloto.value != "" 
            && document.formulario.Poblacion_Piloto.value != "" && document.formulario.Provincia_Piloto.value != "" && document.formulario.Pais_Piloto.value != "" 
            && document.formulario.Movil_Piloto.value != "" && document.formulario.Fijo_Piloto.value != "" && document.formulario.Fax_Piloto.value != "" && document.formulario.Condiciones.value = "Acepto"
            && document.formulario.MAX_FILE_SIZE.value= "4194304") {
            document.formulario.submit();
            } else {
            alert("Hay alg&uacute;n campo vacio! Es obligatorio rellenarlos todos.");
            }
            // TOAD
            }
            </script>

Con todo esto cuando le doy a enviar no salta el error... Incluso a veces le doy a enviar y no hace nada, como si no funcionase...

Alguien sabe por que puede ser?

Muchas gracias a todos :)
__________________
Going hard for too long... Can't get enough
  #12 (permalink)  
Antiguo 02/01/2015, 06:40
Avatar de GeekGirl  
Fecha de Ingreso: julio-2014
Mensajes: 423
Antigüedad: 10 años, 4 meses
Puntos: 44
Respuesta: Button obligatorio error
Está mal que uses el evento onclick para validar el envío de un formulario. Uśa el evento onsubmit="verifica()" y en lugar de hacer submit() usa return true y false respectivamente:

Código Javascript: 
Ver original
  1. function verifica() {
  2.             if ((document.formulario.Categoria.value = "1" OR document.formulario.Categoria.value = "2" OR document.formulario.Categoria.value = "3" OR document.formulario.Categoria.value = "4" OR document.formulario.Categoria.value = "5" )
  3.             (document.formulario.Carrera.value = "1" OR document.formulario.Carrera.value = "2" OR document.formulario.Carrera.value = "3" OR document.formulario.Carrera.value = "4" )
  4.             && document.formulario.Concursante_Colectivo.value != "" && document.formulario.Representante.value != "" && document.formulario.Concursante_Individual.value != ""
  5.             && document.formulario.Nif_Concursante.value != "" && document.formulario.Licencia_Concursante.value != "" && document.formulario.Licenciacopia_Concursante.value != "" 
  6.             && document.formulario.Email_Concursante.value != "" && document.formulario.Direccion_Concursante.value != "" && document.formulario.Numero_Concursante.value != ""
  7.             && document.formulario.CPConcursante.value != "" && document.formulario.Poblacion_Concursante.value != "" && document.formulario.Provincia_Concursante.value != "" 
  8.             && document.formulario.Pais_Concursante.value != "" && document.formulario.Movil_Concursante.value != "" && document.formulario.Fijo_Concursante.value != "" 
  9.             && document.formulario.Fax_Concursante.value != "" && document.formulario.Nombre_Piloto.value != "" && document.formulario.Apellido_Piloto.value != "" 
  10.             && document.formulario.OtroApellido_Piloto.value != "" && document.formulario.Nif_Piloto.value != "" && document.formulario.Licencia_Piloto.value != "" 
  11.             && document.formulario.Licenciacopia_Piloto.value != "" && document.formulario.Fecha_Piloto.value != "" && document.formulario.Email_Piloto.value != "" 
  12.             && document.formulario.Direccion_Piloto.value != "" && document.formulario.Numero_Piloto.value != "" && document.formulario.CPPiloto.value != "" 
  13.             && document.formulario.Poblacion_Piloto.value != "" && document.formulario.Provincia_Piloto.value != "" && document.formulario.Pais_Piloto.value != "" 
  14.             && document.formulario.Movil_Piloto.value != "" && document.formulario.Fijo_Piloto.value != "" && document.formulario.Fax_Piloto.value != "" && document.formulario.Condiciones.value = "Acepto"
  15.             && document.formulario.MAX_FILE_SIZE.value= "4194304") {
  16.             return true;
  17.             } else {
  18.             alert("Hay alg&uacute;n campo vacio! Es obligatorio rellenarlos todos.");
  19.             return false;
  20.             }
  21.             // TOAD
  22.             }

Saludos
  #13 (permalink)  
Antiguo 02/01/2015, 10:20
Avatar de maiksix  
Fecha de Ingreso: noviembre-2014
Ubicación: Sabadell
Mensajes: 124
Antigüedad: 10 años
Puntos: 1
Respuesta: Button obligatorio error
Perfecto!!!

Ya funciona! Genial :) Muchas gracias!

Un saludo a todos!
__________________
Going hard for too long... Can't get enough

Etiquetas: button, obligatorio
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 07:56.