Foros del Web » Programando para Internet » Javascript »

checkbox y JavaScript

Estas en el tema de checkbox y JavaScript en el foro de Javascript en Foros del Web. Saludos tengo una pequeña inquietud y espero me puedan ayudar o guiar. Pasa que tengo en un formulario los siguientes checkbox: Código HTML: Dia Libre: ...
  #1 (permalink)  
Antiguo 15/05/2011, 13:01
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 18
Antigüedad: 11 años, 6 meses
Puntos: 0
Pregunta checkbox y JavaScript

Saludos tengo una pequeña inquietud y espero me puedan ayudar o guiar.
Pasa que tengo en un formulario los siguientes checkbox:
Código HTML:
Dia Libre:<br>
<input type="checkbox" name="ND" checked />No definió<br>

<input type="checkbox" name="dia[]" value="Lunes"/>Lunes<br>
<input type="checkbox" name="dia[]" value="Martes"/>Martes<br>
<input type="checkbox" name="dia[]" value="Miercoles"/>Miércoles<br>
<input type="checkbox" name="dia[]" value="Jueves"/>Jueves<br>
....
Lo que yo quiero es que por defecto la casilla No definió, venga seleccionada, pero ya al darle click a cualquiera de los checkbox que contenga un día se deseleccione No definió, y asi si selecciono varios dias, la casilla No definió se quede deseleccionada, pero si nuevamente deselecciono los dias osea no selecciono ningun dia automaticamenteNo definió quede seleccionada, espero mi idea quede entendida espero y agradesco cualquier tipo de sugerencia y ayuda, aclaro que no soy un experto en Javascript.
  #2 (permalink)  
Antiguo 15/05/2011, 13:39
Avatar de abimaelrc
Colaborador
 
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.734
Antigüedad: 13 años, 1 mes
Puntos: 1517
Respuesta: checkbox y JavaScript

¿No te sirve mejor los botones de radio? Porque a mi parecer es lo que deseas lograr.
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos
  #3 (permalink)  
Antiguo 15/05/2011, 13:43
 
Fecha de Ingreso: abril-2011
Mensajes: 1.342
Antigüedad: 11 años, 1 mes
Puntos: 344
Respuesta: checkbox y JavaScript

Los botones de radio sólo dejan elegir una opción a la vez.

Él quiere elegir varios días de la semana, pero si no hay ninguno elegido que se seleccione el que pone No definió.

Yo utilizaría JQuery para lo que quieres, aunque se puede hacer con javascript manualmente.
  #4 (permalink)  
Antiguo 15/05/2011, 13:44
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 18
Antigüedad: 11 años, 6 meses
Puntos: 0
Respuesta: checkbox y JavaScript

Asi es alex, tendrias un ejemplo o una guia??
  #5 (permalink)  
Antiguo 15/05/2011, 13:50
Avatar de Patriarka  
Fecha de Ingreso: enero-2011
Ubicación: Moreno, Buenos Aires, Argentina
Mensajes: 2.851
Antigüedad: 11 años, 5 meses
Puntos: 288
Respuesta: checkbox y JavaScript

proba esto:
Código Javascript:
Ver original
  1. checkControl= false,
  2.  
  3.     function checkAll()
  4.     {
  5.         var chks = document.getElementsByName('dia[]') ;
  6.  
  7.         var control = (this.checkControl) ? false : true ;
  8.  
  9.         for(var i = 0; i < chks.length; i++)
  10.             chks[i].checked = control;
  11.  
  12.         this.checkControl = control ;
  13.     }
  #6 (permalink)  
Antiguo 15/05/2011, 13:54
 
Fecha de Ingreso: abril-2011
Mensajes: 1.342
Antigüedad: 11 años, 1 mes
Puntos: 344
Respuesta: checkbox y JavaScript

En esta página (http://api.jquery.com/checked-selector/) hay un ejemplo con JQuery aunque el código de Patriarka está muy bien.
  #7 (permalink)  
Antiguo 15/05/2011, 13:55
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 18
Antigüedad: 11 años, 6 meses
Puntos: 0
Respuesta: checkbox y JavaScript

Se agradece su pronta respuesta, pero como implementaria el codigo de Patriarka??
  #8 (permalink)  
Antiguo 15/05/2011, 14:13
 
Fecha de Ingreso: abril-2011
Mensajes: 1.342
Antigüedad: 11 años, 1 mes
Puntos: 344
Respuesta: checkbox y JavaScript

Ahora que miro el código de Patriarka, creo que no es lo que tu querías.

Algo así, es un ejemplo:


Código Javascript:
Ver original
  1. function checkAll(name)
  2.     {
  3.  
  4.         var chks = document.getElementsByName(name) ;
  5.  
  6.         var control=0;
  7.  
  8.         for(var i = 0; i < chks.length; i++)
  9.            if (chks[i].checked)
  10.             control++;
  11.                
  12.  
  13.         return control;
  14.     }
  15.  
  16.  
  17. var checkboxs = document.getElementsByName('dia[]');
  18. for(var i=0; i<checkboxs.length; i++) {
  19. checkboxs[i].onchange = function(){ alert('Seleccionados: '+checkAll('dia[]'))};
  20. }

He cambiado la función CheckAll para que te devuelva cuanto checkbox están seleccionados, luego tu podrías hacer que si hay cero, se seleccione el otro checkbox y al revés.
  #9 (permalink)  
Antiguo 15/05/2011, 14:13
Avatar de fekaa11  
Fecha de Ingreso: abril-2011
Ubicación: Córdoba / Argentina
Mensajes: 115
Antigüedad: 11 años, 2 meses
Puntos: 34
Respuesta: checkbox y JavaScript

Soy medio bruto en javascript, pero a ver si te sirve:
Código Javascript:
Ver original
  1. <html>
  2. <head><title>Prueba - Fekaa</title>
  3. <script type="text/javascript">
  4. function estado(){
  5.     var dias = document.getElementsByName("dia[]");
  6.     var ND = document.f1.ND;
  7.     var select = false;
  8.     for(var i=0;i<dias.length;i++){
  9.         if(ND.checked==true){
  10.             dias[i].checked = false;
  11.             dias[i].disabled = true;
  12.         }else{
  13.             dias[i].disabled = false;
  14.         }
  15.         if(dias[i].checked==true){
  16.             select = true;
  17.         }
  18.     }
  19.     if(select==true){
  20.         ND.disabled = true;
  21.         ND.checked = false;
  22.     }else{
  23.         ND.disabled = false;
  24.     }
  25. }
  26. </script>
  27. </head>
  28. <body>
  29. <form name="f1">
  30. Dia Libre:<br>
  31. <input type="checkbox" name="ND" onclick="estado();" />No defini&oacute;<br>
  32.  
  33. <input type="checkbox" name="dia[]" value="Lunes" onclick="estado();"/>Lunes<br>
  34. <input type="checkbox" name="dia[]" value="Martes" onclick="estado();"/>Martes<br>
  35. <input type="checkbox" name="dia[]" value="Miercoles" onclick="estado();"/>Miércoles<br>
  36. <input type="checkbox" name="dia[]" value="Jueves" onclick="estado();"/>Jueves<br>
  37. </form>
  38. </body>
  39. </html>

Quizás haya lineas de código de más, lo mejor es que busques una forma de simplificarlo. Saludos !
__________________
Pedir perdón es de hombres inteligentes. Perdonar es de sabios.
  #10 (permalink)  
Antiguo 15/05/2011, 14:19
Avatar de Patriarka  
Fecha de Ingreso: enero-2011
Ubicación: Moreno, Buenos Aires, Argentina
Mensajes: 2.851
Antigüedad: 11 años, 5 meses
Puntos: 288
Respuesta: checkbox y JavaScript

como no sabes implementar mi codigo,

es un simple onclick en

<input type="checkbox" name="ND" checked />No definió<br>

a vos te falta hacer q si ND esta en true se seleccionan todas
si hago click otra ves los deselecciono

asi lo mismo son un radio mas facil

tienen q hacer simples IFSSSSS
  #11 (permalink)  
Antiguo 15/05/2011, 14:25
Avatar de abimaelrc
Colaborador
 
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.734
Antigüedad: 13 años, 1 mes
Puntos: 1517
Respuesta: checkbox y JavaScript

¿Oh, o sea que si se selecciona cualquier día de la semana (o cualquiera) no esté seleccionado No definió? En todo caso, eso es javascript. Pero algo sencillo con javascript es así
Código PHP:
<script type="text/javascript">
function 
addListener(elementtypeexpressionbubbling)
{
    
bubbling bubbling || false;

    if(
element.addEventListener) { // Standard
        
element.addEventListener(typeexpressionbubbling);
        return 
true;
    } else if(
element.attachEvent) { // IE
        
element.attachEvent('on' typeexpression);
        return 
true;
    } else return 
false;
}

var 
obj document.getElementsByName('week');
function 
allChecksEmpty(){
    for(var 
i in obj){
        if(
&& obj[i].checked){
            return 
false;
        }
    }
    return 
true;
}
function 
fixChecked(){
    for(var 
i in obj){
        
addListener(obj[i], 'click', function(){
            
obj[0].checked false;
            if(
allChecksEmpty()){
                
obj[0].checked true;
            }
        });
    }
}
window.onload fixChecked;
</script>

<input type="checkbox" name="week" value="nd" checked="checked" /> ND<br />
<input type="checkbox" name="week" value="l" /> L<br />
<input type="checkbox" name="week" value="m" /> M<br />
<input type="checkbox" name="week" value="w" /> W<br />
<input type="checkbox" name="week" value="j" /> J<br />
<input type="checkbox" name="week" value="v" /> V<br />
<input type="checkbox" name="week" value="s" /> S<br />
<input type="checkbox" name="week" value="d" /> D 
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos
  #12 (permalink)  
Antiguo 15/05/2011, 14:39
 
Fecha de Ingreso: agosto-2010
Ubicación: Tenerife
Mensajes: 893
Antigüedad: 11 años, 10 meses
Puntos: 202
Respuesta: checkbox y JavaScript

abimaelrc Me encanta tu forma de programar, sobre todo porque es limpio y fácilmente reutilizable
Ummm ... pero si ya estaban liados con los checks y postean esto en php, ¿no crees que es mucho meterles los Listener? Es decir, sólo le pusistes comentado que el maldito IE usa el attachEvent xDDDDD
__________________
Pensaba que internet era una gran biblioteca de sabiduría, hasta que comprendí que un libro no puede tener mil páginas llenas de faltas de ortografía... :(
  #13 (permalink)  
Antiguo 15/05/2011, 14:50
Avatar de abimaelrc
Colaborador
 
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.734
Antigüedad: 13 años, 1 mes
Puntos: 1517
Respuesta: checkbox y JavaScript

Recomiendo esta lectura http://en.wikipedia.org/wiki/Unobtrusive_JavaScript. La idea es separar responsabilidad. Las etiquetas se usan para marquetar, es decir describir la estructura de un documento. Eso quiere decir que se debe evitar mezclar programación con marquetación. También se debe evitar combinar apariencia con marquetación, para eso es CSS, etc. etc.
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos
  #14 (permalink)  
Antiguo 15/05/2011, 15:42
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 18
Antigüedad: 11 años, 6 meses
Puntos: 0
Respuesta: checkbox y JavaScript

muchas gracias el codigo de fekaa11 me sirvio, gracias a todos.

Etiquetas: checkbox, php
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




La zona horaria es GMT -6. Ahora son las 03:20.