Ver Mensaje Individual
  #7 (permalink)  
Antiguo 02/02/2013, 20:58
Avatar de pabloe9k
pabloe9k
 
Fecha de Ingreso: julio-2008
Ubicación: Argentina
Mensajes: 190
Antigüedad: 15 años, 9 meses
Puntos: 3
Pregunta Respuesta: deshabilitar boton hasta completar campos

Cita:
Iniciado por emprear Ver Mensaje
Gracias por la corrección. Ya lo arreglé haciendo un par de modificaciones, y le hice ya que estamos el trim para los value y agregué el evento onkeyup dinamicamente

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <title>Submit disabled</title>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  6.  <script type="text/javascript">
  7. //<![CDATA[
  8. // Definimos los campos que se han de verificar, contruimos un array con los id de los mismos
  9. var campos = ["campo1", "campo2", "campo3", "campo4"];
  10. function activar() {
  11. var c = 0;
  12. for(var i in campos){
  13. i = parseInt(i);
  14. var cadenaL = document.getElementById(campos[i]).value;
  15. // hacemos un trim previo a la verificación
  16. cadenaL = cadenaL.replace(/^\s+/g,'').replace(/\s+$/g,'')
  17. if(cadenaL != ""){
  18. c++; // incrementamos c por cada campo que no está vacío
  19. }
  20. if(c == (i+1)){ // si c es = al total de los campos habilitamos el submit
  21. document.getElementById('envia').disabled = false;
  22. }else{
  23. document.getElementById('envia').disabled = true;
  24. }
  25. }
  26. }
  27.  
  28. // agregamos el evento onkeyup dinamicamente a los campos requeridos
  29. window.onload = function(){
  30.     for(var e in campos){
  31.     var elem = document.getElementById(campos[e])
  32.     if (elem.addEventListener){
  33.     elem.addEventListener("keyup", function(){activar()}, false);
  34.     }else{ // <IE9
  35.         if (elem.attachEvent){
  36.         elem.attachEvent ("onkeyup", function () {activar(elem)});
  37.         }
  38.     }
  39.     }
  40. }
  41.  
  42. //]]>
  43. </head>
  44. <form action="#" method="post">
  45. <input type="text" id="campo1" value="" /><br />
  46. <input type="text" id="campo2" value="" /><br />
  47. <input type="text" id="campo3" value="" /><br />
  48. <input type="text" id="campo4" value="" /><br />
  49. <input type="submit" id="envia" name="envia" value="procesar" disabled="disabled"/><br />
  50. </form>
  51. </body>
  52. </html>

Demo
http://foros.emprear.com/javascript/...submit_ok.html

Saludos

Me funcionó perfectamente! Son unos grandes programadores!!
Sólo tengo una consulta para hacer:

Si uno de los campos que estoy validando, en lugar de un campo de texto es un Combo Select, como lo validarían?

Gracias, amigos.