Avatar billede mik28 Seniormester
04. januar 2005 - 13:18 Der er 20 kommentarer og
1 løsning

validering af radiobutton

Hej Eksperter,

Jeg har en side som i princippet ser således ud

<html>
<head>
<script language="JavaScript">

function validate(f){
       
        // værdier som skal valideres
        valg                    =f.valg.value
       
        if (valg.length<1){
        alert("FEJL");
        return false;
        }
       
        return true;
}
</script>
</head>

<body>
<form name="sporge" onsubmit="return validate(this);">
<input type="radio" name="valg" value="1">
<input type="radio" name="valg" value="2">
<input type="submit" name="send" value="Send">
</form>
</body>
</html>

Hvordan sikre jeg mig at valg har en værdi
Avatar billede mik28 Seniormester
04. januar 2005 - 13:30 #1
Hvorfor får valg ikke den værdi som jeg vælger???
Avatar billede fennec Nybegynder
04. januar 2005 - 13:30 #2
if (f.valg[0].checked || f.valg[1].checked)
{
// OK
  return true;
}
else
{
// NOT
  alert('FEJL');
  return false;
}
Avatar billede mik28 Seniormester
04. januar 2005 - 13:34 #3
Jeg har prøvet at skrive valg ud og den står bare som undefined, også selv om jeg vælger en værdi
Avatar billede fennec Nybegynder
04. januar 2005 - 13:36 #4
.... Gennem JavaScript skal du selv finde den valgte box/radio, ved at løbe dem igennem, hvis du vil have værdien.

for (temp=0;temp<f.valg.length;temp++)
{
  if(f.valg[temp].checked)
    valg = f.valg[temp].value;
}
Avatar billede mik28 Seniormester
04. januar 2005 - 13:39 #5
Jeg er i princippet ikke interesseret i værdien, kun om den er valgt
Avatar billede fennec Nybegynder
04. januar 2005 - 13:43 #6
Det er mit første script. Der tjekker den for om en af dem er valgt (checked).
Avatar billede mik28 Seniormester
04. januar 2005 - 13:44 #7
hmmm. Nu har jeg jo en række valg som skal checkes. Kan man ikke lave det sådan at true kun bliver returneret hvis alle er udfyldt
Avatar billede fennec Nybegynder
04. januar 2005 - 13:48 #8
Afhængig af hvormange du har kan du gøre det mere dynamisk. Her er der 3 grupper (valg1, valg2 og valg3) hver med 2 muligheder:

if ((f.valg1[0].checked || f.valg1[1].checked) && (f.valg2[0].checked || f.valg2[1].checked) && (f.valg3[0].checked || f.valg3[1].checked))

Hvis du har rigtig mange ville det være bedre at lave nogle løkker som finder elementerne dynamisk.
Avatar billede mik28 Seniormester
04. januar 2005 - 13:56 #9
Sådan ikke?

if ( (f.valg1[0].checked || f.valg1[1].checked) && (f.valg2[0].checked || f.valg2[1].checked) )

Jeg får ikke true selv om de begge er checked :-(
Avatar billede fennec Nybegynder
04. januar 2005 - 14:00 #10
Kunne jeg ikke lige se hele din kode...
Avatar billede mik28 Seniormester
04. januar 2005 - 14:00 #11
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>





<head>
<title>Admlogin</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="./style/style.css">
<script language="JavaScript">

function validate(f){
       
        // værdier som skal valideres
                if ( (f.valg1[0].checked || f.valg1[1].checked) && (f.valg2[0].checked || f.valg2[1].checked) )
                {
                // OK
              return true;
                }
               
                else
                {
                // NOT
              alert('Alle spørgsmål bedes besvaret');
              return false;
                }
   
}
</script>

</head>
<body style="background-image:url('');background-repeat: no-repeat;">
<div style="display:inline;position:absolute;padding-top:0px;margin-top:20px;margin-left:0px;height:150px;width:350px;background-color:transparent;">
Velkommen til Spørgeskemaet <b>brian</b>
</div>

<div style="overflow:auto;display:inline;position:absolute;padding-top:0px;margin-top:60px;margin-left:0px;height:500px;width:920px;background-color:transparent;">

<form name="sporge" onsubmit="return validate(this);">
<table border="1" style="width:900px;">
<tr>
<th style="width:400px;text-align:left;">Spørgsmål</th>

<th style="width:100px;">meget uenig</th>
<th style="width:100px;">uenig</th>
<th style="width:100px;">ved ikke</th>
<th style="width:100px;">enig</th>
<th style="width:100px;">meget enig</th>
</tr>

<tr>
<td>Sprøgsmål 1</td>
<td style="text-align:center;"><input type="radio" name="valg1" value="1"></td>
<td style="text-align:center;"><input type="radio" name="valg1" value="2"></td>
<td style="text-align:center;"><input type="radio" name="valg1" value="3"></td>
<td style="text-align:center;"><input type="radio" name="valg1" value="4"></td>
<td style="text-align:center;"><input type="radio" name="valg1" value="5"></td>
</tr>

<tr>
<td>Spørgsmål 2</td>
<td style="text-align:center;"><input type="radio" name="valg2" value="1"></td>
<td style="text-align:center;"><input type="radio" name="valg2" value="2"></td>
<td style="text-align:center;"><input type="radio" name="valg2" value="3"></td>
<td style="text-align:center;"><input type="radio" name="valg2" value="4"></td>
<td style="text-align:center;"><input type="radio" name="valg2" value="5"></td>
</tr>

</table>
<div style="text-align:right;">
<br />
<input type="submit" name="send" value="Send">
</div>
</form>
</div>
</body>
</html>
Avatar billede fennec Nybegynder
04. januar 2005 - 14:06 #12
Du har 5 elementer i hver gruppe. Vi skal have alle dem med på listen:

if ( (f.valg1[0].checked || f.valg1[1].checked || f.valg1[2].checked || f.valg1[3].checked || f.valg1[4].checked) && (f.valg2[0].checked || f.valg2[1].checked || f.valg2[2].checked || f.valg2[3].checked || f.valg2[4].checked) )

Det er dog ikke smart med en så lang if-sætning, så hvis du får flere radiobuttons på skulle vi nok finde den dynamiske løsning i stedet.
Avatar billede mik28 Seniormester
04. januar 2005 - 14:15 #13
Kan man gøre noget i den her stil

for (temp=0;temp<f.valg1.length;temp++)
{
  if (f.valg1[temp].checked)
  {
  // OK
  return true;
  }

  else
  {
  // NOT
  alert('Alle spørgsmål bedes besvaret');
  return false;
  }
}
Avatar billede mik28 Seniormester
04. januar 2005 - 14:23 #14
Jeg kan vist godt se problemet. Den vil jo returnerer false i første gennemløb
Avatar billede fennec Nybegynder
04. januar 2005 - 14:26 #15
Det er noget i den stil, men det skal laves for hver gruppe. Jeg arbejder lige på det....
Avatar billede fennec Nybegynder
04. januar 2005 - 14:32 #16
Dette har jeg ikke testet, men det er noget i den stil. Du skal bare sætte "antalGrupper" til det antal ? der er. Den finder dynamisk ud af hvor mange svarmuligheder der er i hver gruppe.

returVal = true;
antalGrupper = 5;
for(temp=1;temp<=antalGrupper;temp++)
{
  col = document.getElementsByName("valg"+ temp)
  tempTjek = false;
  for(temp1=0;temp1<col.length;temp1++)
  {
    if(col[temp1].checked)
      tempTjek = true;
  }
  if(!tempTjek)
  {
    returVal = false;
  }
}
if(!returVal)
  alert("fejl")
return returVal;
Avatar billede mik28 Seniormester
04. januar 2005 - 14:45 #17
Jeg kan ikke få det til at virke.
Avatar billede mik28 Seniormester
04. januar 2005 - 14:49 #18
der vil altid være det samme antal svarmuligheder (5), men der vil være X antal spørgsmål. Reglen vil være at de hedder valg 1 til valg X.
Avatar billede mik28 Seniormester
04. januar 2005 - 14:50 #19
Jeg må sku nok hellere ligge det lidt fra mig :-)
Avatar billede fennec Nybegynder
04. januar 2005 - 14:59 #20
Det burde faktisk virke. Denne gør:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Admlogin</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="./style/style.css">
<script language="JavaScript">

function validate(f){
       
    returVal = true;
    antalGrupper = 2;
    for(temp=1;temp<=antalGrupper;temp++)
    {
      col = document.getElementsByName("valg"+ temp)
      tempTjek = false;
      for(temp1=0;temp1<col.length;temp1++)
      {
        if(col[temp1].checked)
          tempTjek = true;
      }
      if(!tempTjek)
      {
        returVal = false;
      }
    }
    if(!returVal)
      alert("fejl")
    return returVal;   
}
</script>

</head>
<body style="background-image:url('');background-repeat: no-repeat;">
<div style="display:inline;position:absolute;padding-top:0px;margin-top:20px;margin-left:0px;height:150px;width:350px;background-color:transparent;">
Velkommen til Spørgeskemaet <b>brian</b>
</div>

<div style="overflow:auto;display:inline;position:absolute;padding-top:0px;margin-top:60px;margin-left:0px;height:500px;width:920px;background-color:transparent;">

<form name="sporge" onsubmit="return validate(this);">
<table border="1" style="width:900px;">
<tr>
<th style="width:400px;text-align:left;">Spørgsmål</th>

<th style="width:100px;">meget uenig</th>
<th style="width:100px;">uenig</th>
<th style="width:100px;">ved ikke</th>
<th style="width:100px;">enig</th>
<th style="width:100px;">meget enig</th>
</tr>

<tr>
<td>Sprøgsmål 1</td>
<td style="text-align:center;"><input type="radio" name="valg1" value="1"></td>
<td style="text-align:center;"><input type="radio" name="valg1" value="2"></td>
<td style="text-align:center;"><input type="radio" name="valg1" value="3"></td>
<td style="text-align:center;"><input type="radio" name="valg1" value="4"></td>
<td style="text-align:center;"><input type="radio" name="valg1" value="5"></td>
</tr>

<tr>
<td>Spørgsmål 2</td>
<td style="text-align:center;"><input type="radio" name="valg2" value="1"></td>
<td style="text-align:center;"><input type="radio" name="valg2" value="2"></td>
<td style="text-align:center;"><input type="radio" name="valg2" value="3"></td>
<td style="text-align:center;"><input type="radio" name="valg2" value="4"></td>
<td style="text-align:center;"><input type="radio" name="valg2" value="5"></td>
</tr>

</table>
<div style="text-align:right;">
<br />
<input type="submit" name="send" value="Send">
</div>
</form>
</div>
</body>
</html>

Bare husk at ændre "antalGrupper = 2" til det antal ? der er.
Avatar billede mik28 Seniormester
04. januar 2005 - 15:02 #21
Skide godt. Tak for hjælpen :-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester