[JavaScript] - meerdere formulier veld controles

[anoniem]

Ik heb een webformulier met 10 Input-Text velden. Deze mogen alleen een numerieke waarde bevatten. Daar heb ik de volgende code voor bedacht: [code:1:32e6a3cc15]</script> <script type="text/javascript"> function validate01() { txt = document.forms[0].veld01.value if (txt>=1 && txt<=999) { return true } else { document.forms[0].veld01.value = "" alert("Je kunt alleen getallen tussen 0 en 1.000 invullen") return false } } </script>[/code:1:32e6a3cc15] Deze werkt prima, maar ik heb 10 velden: veld01 t/m veld10 Moet ik 10 keer een verschillende validate functie maken of is er een nettere oplossing?

[anoniem]

Natuurlijk is er een nettere methode. Als je kijkt naar hoe het javascript model is opgebouwd zie je dat alle objecten in de pagina worden 'opgeslagen' in collecties. Bijvoorbeeld alle forms op een pagina (document.forms) en ook alle elementen van een form (document.forms[index].elements). En met een for loop kan je door zo'n collectie wandelen. De meest simpele methode kan bijvoorbeeld iets zijn als: [code:1:d101c26b78] function validate01() { var s; for (var i = 0; i <= 10; i++) { // evt. een nul ervoor plakken bij getallen onder de 10 s = (i < 10) ? "0" + i : i; if (document.forms["formnaam"].elements["veld" + s].value > 1) { // enz. enz. } } } [/code:1:d101c26b78] Maar mooier vind ik het om het geheel wat dynamischer te houden, bijv: [code:1:d101c26b78] function validate01(mFormIndex) { var bCorrectValues = true; var oFormElements = document.forms[mFormIndex].elements; for (var i=0; i < oFormElements.length; i++) { // controleer of het een text input is // en de naam voldoet aan de regel "veldXX", if (oFormElements[i].type == 'text' && /^veld\d+$/.test(oFormElements[i].name)) { if (oFormElements[i].value < 1 || oFormElements[i].value > 999) { bCorrectValues = false; oFormElements[i].value = ''; } } } if (bCorrectValues) { return true; } else { alert("Je kunt alleen getallen tussen 0 en 1.000 invullen"); return false; } } [/code:1:d101c26b78] De check op de naam kan je ook met indexOf() doen ([color=blue:d101c26b78]oFormElements[i].name.indexOf('veld') != -1[/color:d101c26b78]) in plaats van de reguliere expressie, alleen is deze methode iets strakker. En zo zijn er nog tig manieren te bedenken waarop je dit kan aanpakken. Overigens is je methode om te controleren op getallen niet helemaal solide (de invoer "1a" zal bijvoorbeeld goedgekeurd worden in jouw check), maar ik weet niet hoe strak het allemaal gecontroleerd moet worden. Als je een beetje zoekt moet er iig genoeg te vinden zijn hoe je het beter aanpakt.

[anoniem]

Thanx voor de uitgebreide uitleg, ik print 'm uit om eens goed te bestuderen. Ik heb "1a" gecontroleerd, maar die wordt netjes afgevangen.

[anoniem]

[quote:5f0f701fc0="Johant"] Ik heb "1a" gecontroleerd, maar die wordt netjes afgevangen.[/quote:5f0f701fc0] Vreemd, 1a wordt hier gecast naar een integer (1) en voldoet dus aan de regel (1-999) terwijl je zou mogen verwachten dat 1a hier niet aan voldoet (imho).

[anoniem]

Moet wel zeggen dat bij het testen een aantal rare meldingen kwamen, zoals dat 34 wel een getal was, maar geen integer. Het werkt nu naar behoren, dus heb me daar verder niet zo druk over gemaakt.