permitir maximo checkbox por grupos

[stron1889]

Hola muy buenas, tengo un formulario que varias de sus preguntas son con checkbox, necesito que en cada pregunta que tenga un checkbox solo pueda poner como maximo 3 chekeados.
Tengo algo parecido pero me coge todos los checkbox no por grupo.


Codigo js

Código:

function validacion(obj) {
  limite=3;                  
  num=0;
  if (obj.checked) {    
    for (i=0; ele=obj.form.elements[i]; i++)
      if (ele.checked) num++;   
  if (num>limite)
    obj.checked=false;
  }
} 


function validaciona(obj) {
limitea=3;
 numa=0;                        
  if (obj.checked) {    
    for (a=0; elea=obj.form.elements[a]; a++)
      if (elea.checked) numa++;
  if (numa>limitea)
    obj.checked=false;
  }
}

codigo html

1ºgrupo

Código HTML:

<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="GNSS systems" onclick="at5n();onchange=validacion(this)"> GNSS systems
<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="Hyperspectral remote sensing" onclick="at5n();onchange=validacion(this)"> Hyperspectral remote sensing
<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="No deficiencies" onclick="at5n();onchange=validacion(this)"> No deficiencies
<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="Cartography" onclick="at5n();onchange=validacion(this)"> Cartography

2º grupo
<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="Surveying" onclick="at6n();onchange=validaciona(this)"> Surveying</p></label>
label><p><INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="Cadastre" onclick="at6n();onchange=validaciona(this)"> Cadastre
INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="Civil works surveying" onclick="at6n();onchange=validaciona(this)"> Civil works surveying
<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="LiDAR" onclick="at6n();onchange=validaciona(this)"> LiDAR

Gracias de antemano

[emprear]

Y no sería mejor agrupar tus preguntas por el name y utilizar
getElementsByName()

No entiendo porque si hay un grupo de pregunta 1 y un grupo de preguntas 2, ambos tienen por name PREGUNTA9

SAludos

[stron1889]

Si me equivoque al ponerlo quedaria asi

Código:

function validacion(obj) {
  limite=3;                  
  num=0;
  if (obj.checked) {    
    for (i=0; ele=obj.form.elements[i]; i++)
      if (ele.checked) num++;   
  if (num>limite)
    obj.checked=false;
  }
} 


function validaciona(obj) {
limitea=3;
 numa=0;                        
  if (obj.checked) {    
    for (a=0; elea=obj.form.elements[a]; a++)
      if (elea.checked) numa++;
  if (numa>limitea)
    obj.checked=false;
  }
}

Código:

<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="GNSS systems" onclick="at5n();onchange=validacion(this)"> GNSS systems
<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="Hyperspectral remote sensing" onclick="at5n();onchange=validacion(this)"> Hyperspectral remote sensing
<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="No deficiencies" onclick="at5n();onchange=validacion(this)"> No deficiencies
<INPUT TYPE="checkbox" NAME="PREGUNTA9" VALUE="Cartography" onclick="at5n();onchange=validacion(this)"> Cartography

2º grupo
<INPUT TYPE="checkbox" NAME="PREGUNTA10" VALUE="Surveying" onclick="at6n();onchange=validaciona(this)"> Surveying</p>
<INPUT TYPE="checkbox" NAME="PREGUNTA10" VALUE="Cadastre" onclick="at6n();onchange=validaciona(this)"> Cadastre
INPUT TYPE="checkbox" NAME="PREGUNTA10" VALUE="Civil works surveying" onclick="at6n();onchange=validaciona(this)"> Civil works surveying
<INPUT TYPE="checkbox" NAME="PREGUNTA10" VALUE="LiDAR" onclick="at6n();onchange=validaciona(this)"> LiDAR

y la verdad ahora que dices lo del nombre, creo que deberia de tener algo como PREGUNTA9-1, PREGUNTA9-2... ya que me gustaria almacenar en una base de datos los checked. ¿Como lo podria hacer con document.getElementsByName(name)?

Gracias

[Dradi7]

Mira para que puedas ser reconocida desde un lenguaje servidor debes hacerlo haciendo los name de esta manera

name = "pregunta9[]"

Para poder recorrerlo desde el JavaScript

document.getElementByName("pregunta9[]")

Con esto podrá ser reconocido como un array desde tu lenguaje servidor

Saludos

[stron1889]

Si no fuera mucho pedir pedir ¿podrias poner el codigo?

[stron1889]

he editado lo siguiente y lo he medio conseguido, el problema es que segun vas pulsando se van desactivando las anteriores hasta que solo se quedan activadas las 3 primeras ( ya que cuento 3 desde que empieza el bucle)

Código:

function validacion() { 
 var suma = 0;                  
 var x = document.getElementsByName("PREGUNTA9[]");
for (var i = 0, j = x.length; i < j; i++) {
    if(x[i].checked == true){   
    suma++;
    } 
    if (suma == 3){
        x[i].checked=false;

        }
}
}

Código HTML:

<INPUT TYPE="checkbox" NAME="PREGUNTA9[]" VALUE="GNSS systems" onclick="at5n();onchange=validacion(this)"> GNSS systems
<INPUT TYPE="checkbox" NAME="PREGUNTA9[]" VALUE="Hyperspectral remote sensing" onclick="at5n();onchange=validacion(this)"> Hyperspectral remote sensing
<INPUT TYPE="checkbox" NAME="PREGUNTA9[]" VALUE="No deficiencies" onclick="at5n();onchange=validacion(this)"> No deficiencies
<INPUT TYPE="checkbox" NAME="PREGUNTA9[]" VALUE="Cartography" onclick="at5n();onchange=validacion(this)"> Cartography
 

[emprear]

En tanto i crezca siempre será el último. Y el limite debería ser > que no == que
De todas maneras hacer esto es más flexible

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Contar checkboxes marcados</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
//<![CDATA[
function limitar(grupo,limite){
 var grupo=document.getElementsByName(grupo);
 var limite=limite
 for (var i=0; i < grupo.length; i++){
  grupo[i].onchange=function(){
  var tildados=0
  for (var i=0; i < grupo.length; i++)
   tildados+=(grupo[i].checked)? 1 : 0
  if (tildados > limite){
   alert("solo se permiten "+limite+" selecciones")
   this.checked=false
   }
  }
 }
}
 
//]]>
</script>
</head>
<body>
<form action="#">
<p>
<input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> a<br />
<input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> b<br />
<input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> c<br />
<input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> d<br />
<input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> e<br />
</p>
 
<p>
<input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> f<br />
<input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> g<br />
<input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> h<br />
<input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> i<br />
<input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> j<br />
</p>
 
</form>
</body>
</html>
 

Podés cambiar el límite para cada grupo a tu gusto cambiando el parámetro

onchange="limitar(this.name,2);"
onchange="limitar(this.name,4);"
onchange="limitar(this.name,3);"
etc.

Saludos

[stron1889]

Buenas supongo que no deberia de preguntarlo aqui, pero como la duda a surgido de este codigo pues aqui lo digo.

Tengo este codigo

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Contar checkboxes marcados</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <script type="text/javascript">
    //<![CDATA[
    function limitar(grupo,limite){
    var grupo=document.getElementsByName(grupo);
    var limite=limite
    for (var i=0; i < grupo.length; i++){
     grupo[i].onchange=function(){
     var tildados=0
     for (var i=0; i < grupo.length; i++)
      tildados+=(grupo[i].checked)? 1 : 0
     if (tildados > limite){
       alert("solo se permiten "+limite+" selecciones")
       this.checked=false
       }
      }
     }
    }
     
    //]]>
    </script>
    </head>
    <body>
    <form action="#">
    <p>
    <input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> a<br />
    <input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> b<br />
    <input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> c<br />
    <input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> d<br />
    <input type="checkbox" name="PREGUNTA9[]" onchange="limitar(this.name,3);" /> e<br />
    </p>
     
    <p>
    <input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> f<br />
    <input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> g<br />
    <input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> h<br />
    <input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> i<br />
    <input type="checkbox" name="PREGUNTA10[]" onchange="limitar(this.name,2);" /> j<br />
    </p>
     
    </form>
    </body>
    </html>
 

Y funciona correctamente pero el problema viene cuando lo intento pasar a la base de datos.
¿Cual es el problema? Que si clickeo 3 checkbox y pulso en enviar da igual cual de ellos pulse que a la base de datos me enviara los 3 primeros como correctos(pasandome el valor que le defini) y los demas en 0.

este es el codigo php

Código PHP:

  $pregunta9= $_REQUEST['PREGUNTA9']; 
$pregunta91 = $pregunta9[0]; 
$pregunta92 = $pregunta9[1]; 
$pregunta93 = $pregunta9[2]; 
$pregunta94 = $pregunta9[3]; 
$pregunta95 = $pregunta9[4];  
   

Una vez mas gracias.

[emprear]

Ese es un problema básico de php no de javascript
Analizá este código:
http://www.forosdelweb.com/f13/conta...4/#post4171339

Saludos