[JS/HTML] form validation

Pagina: 1
Acties:

  • htca
  • Registratie: November 2001
  • Laatst online: 23:22
ik heb een form met daarin 8 dropdown boxen, die allemaal dezelfde verzameling hebben. Echter de uiteindelijke invoer moet uniek zijn. Ik ben nu een poosje aan het stoeien en knoeien met javascript, maar ik krijg het niet goed voor elkaar omdat ik de array niet goed binnen krijg.
de combo boxen zien er zo uit:
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<select name="squad8[0]">
<option value="none"></option>
<option value="54" >Argentina</option>
<option value="61" >Belgium</option>
<option value="40" selected >Brazil</option>
<option value="50" >Cameroon</option>
<option value="43" >China</option>
<option value="42" >Costa Rica</option>
<option value="58" >Croatia</option>
<option value="35" >Denmark</option>
<option value="59" >Ecuador</option>
<option value="53" >England</option>
<option value="32" >France</option>
<option value="48" >Germany</option>
<option value="57" >Italy</option>
<option value="60" >Japan</option>
<option value="56" >Mexico</option>
<option value="55" >Nigeria</option>
<option value="37" >Paraguay</option>
<option value="47" >Poland</option>
<option value="46" >Portugal</option>
<option value="49" >Rep. of Ireland</option>
<option value="63" >Russia</option>
<option value="51" >Saudi Arabia</option>
<option value="33" >Senegal</option>
<option value="39" >Slovenia</option>
<option value="38" >South Africa</option>
<option value="44" >South Korea</option>
<option value="36" >Spain</option>
<option value="52" >Sweden</option>
<option value="64" >Tunisia</option>
<option value="41" >Turkey</option>
<option value="34" >Uruguay</option>
<option value="45" >USA</option>
</select>

deze combo box komt dus 8 maal terug met een andere index (squad[0] t/m squad[7]) waarbij de value steed uniek moet zijn bij het submitten.
ik heb verschillende aanroepen van het script geprobeerd, maar ik krijg de array niet in het script binnen.
bijvoorbeeld voor alleen de array:
code:
1
onClick="return validate(form1.squad8)"

of voor het hele form (form heet form1):
code:
1
onClick="return validate(form1)"

Het voorlopige script ziet er zo uit:
code:
1
2
3
4
5
6
7
8
9
10
<SCRIPT TYPE="text/javascript">
<!--
 function validate(form1)
{
      var t=form1.length;
      alert(t);
      return false;
}
//-->
</SCRIPT>

Als de array correct binnenkomt, dan lukt me de rest zelf ook wel. Alternatief is alles serverside te doen (voor de zekerheid zal ik dat ook doen, maar ik vind dit vriendelijker naar de gebruikers toe).

  • crisp
  • Registratie: Februari 2000
  • Laatst online: 00:09

crisp

Devver

Pixelated

1) maak handig gebruik van het 'this' keyword, dat scheelt je weer lookups en een overbodig name/id-attribuut:
HTML:
1
<form action="foo" onsubmit="return validate(this)">

2) is een kwestie van de juiste manier gebruiken om je form-elementen aan te spreken; om de value te achterhalen van bijvoorbeeld squad8[0] dan doe je dat zo:
JavaScript:
1
2
3
4
5
6
function validate(form)
{
  var squad8_0 = form.elements['squad8[0]'];
  var squad8_0_value = squad8_0.options[squad8_0.selectedIndex].value;
  // etcetera
}

De logica om te kijken of alle values uniek zijn mag je zelf verzinnen ;)

Intentionally left blank


  • htca
  • Registratie: November 2001
  • Laatst online: 23:22
Dus als ik het goed heb is dit de goed code:
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function validate(form)
{
  var squad8s= new Array(8)
  var squad8_0 = form.elements['squad8[0]'];
  var squad8_1 = form.elements['squad8[1]'];
  var squad8_2 = form.elements['squad8[2]'];
  var squad8_3 = form.elements['squad8[3]'];
  var squad8_4 = form.elements['squad8[4]'];
  var squad8_5 = form.elements['squad8[5]'];
  var squad8_6 = form.elements['squad8[6]'];
  var squad8_7 = form.elements['squad8[7]'];
  squad8s[0] = squad8_0.options[squad8_0.selectedIndex].value;
  squad8s[1] = squad8_1.options[squad8_1.selectedIndex].value;
  squad8s[2] = squad8_2.options[squad8_2.selectedIndex].value;
  squad8s[3] = squad8_3.options[squad8_3.selectedIndex].value;
  squad8s[4] = squad8_4.options[squad8_4.selectedIndex].value;
  squad8s[5] = squad8_5.options[squad8_5.selectedIndex].value;
  squad8s[6] = squad8_6.options[squad8_6.selectedIndex].value;
  squad8s[7] = squad8_7.options[squad8_7.selectedIndex].value;
  // dubbele loop over de array om de dubbele values te detecteren hieronder
}

Eerlijk gezegd, ziet dit er wat omslachtig uit (17 regels om een array van 8 lang te vullen). Als het niet anders kan ga ik wel zo implementeren.

  • crisp
  • Registratie: Februari 2000
  • Laatst online: 00:09

crisp

Devver

Pixelated

htca schreef op donderdag 12 januari 2006 @ 09:39:
Dus als ik het goed heb is dit de goed code:
[...]
Eerlijk gezegd, ziet dit er wat omslachtig uit (17 regels om een array van 8 lang te vullen). Als het niet anders kan ga ik wel zo implementeren.
Tuurlijk niet, als je het uiteindelijk in een array wil hebben kan je ook zoiets doen:
JavaScript:
1
2
3
4
5
6
7
8
9
function validate(form)
{
  var squad8s= new Array();
  for (var i = 0, squad8; i < 8; i++)
  {
    squad8 = form.elements['squad8[' + i + ']'];
    squad8s[i] = squad8.options[squad8.selectedIndex].value;
  }
}

[ Voor 49% gewijzigd door crisp op 12-01-2006 09:48 ]

Intentionally left blank


  • htca
  • Registratie: November 2001
  • Laatst online: 23:22
Thanks Crisp!
JavaScript:
1
  for (var i = 0, squad8; i < 8; i++)

Een laatste vraag: wat doet squad8 in deze regel?
Sorry, declaratie natuurlijk!

[ Voor 15% gewijzigd door htca op 12-01-2006 09:54 ]