Ga naar inhoud

javascript veldcontrole inschrijfformulier


anoniem

Aanbevolen berichten

Beste mensen met de nodige kennis! Ik heb een formulier op een site en probeer daar mbv javascript een controle op te maken zodat de formulieren alleen maar verzonden kunnen worden met alle velden ingevuld. Wie wil er eens naar kijken want ik krijg het niet werkend. foutmelding: Fout op de pagina.[quote:11f5129144]<head> <title>webformulier</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script language="JavaScript"> <!-- function everything(form){ allblanks(form) isNaam(form) isLetter(form) isStraatnaam(form) isHuisnummer(form) isPostcode(form) isWoonplaats(form) isTelefoon(form) isCursusnummer(form) isCursusnaam(form) isDag(form) isTijd(form) isLocatie(form) isOpmerkingen(form) } function compose(form) { var text = "De volgende gegevens zijn niet juist ingevuld:" if(isNaam(form) == false){ text += "\nuw naam"} if(isLetter(form) == false){ text += "\nuw voorletter(s)"} if(isStraatnaam(form) == false){ text += "\nuw straatnaam"} if(isHuisnummer(form) == false){ text += "\nuw huisnummer"} if(isPostcode(form) == false){ text += "\nuw postcode"} if(isWoonplaats(form) == false){ text += "\nuw woonplaats"} if (isTelefoon(form) == false){ text += "\nuw telefoonnummer"} if(isEmail(form) == false){ text += "\nuw e-mail adres"} if (isCursusnummer(form) == false){ text += "\nuw cursusnummer"} if (isCursusnaam(form) == false){ text += "\nuw cursusnaam"} if (isDag(form) == false){ text += "\nuw dag"} if (isTijd(form) == false){ text += "\nuw tijd"} if (isLocatie(form) == false){ text += "\nuw locatie"} if (isOpmerkingen(form) == false){ text += "\nuw Opmerkingen"} alert(text) } function allblanks(form) { if((((((((((((isNaam(form) && isLetter(form)) && isStraatnaam(form)) && isHuisnummer(form)) && isPostcode(form)) && isWoonplaats(form)) && isTelefoon(form)) && isEmail(form))&& isCursusnummer(form))&& isCursusnaam(form))&& isDag(form))&& isTijd(form))&& isLocatie(form))&& isOpmerkingen(form)) { form.submit() doit()} if((((((((((((isNaam(form) == false || isLetter(form) == false) || isStraatnaam(form) == false) || isHuisnummer(form) == false) || isPostcode(form) == false) || isWoonplaats(form) == false) || isTelefoon(form) == false) || isEmail(form) == false) || isCursusnummer(form) == false)|| isCursusnaam(form) == false)|| isDag(form) == false)|| isTijd(form) == false)|| isLocatie(form) == false)|| isOpmerkingen(form) == false){ compose(form)} } function isNaam(form){ if (form.naam.value == ""){ return false} else{ return true} } function isLetter(form){ if (form.letter.value == ""){ return false} else{ return true} } function isStraatnaam(form){ if (form.straatnaam.value == ""){ return false} else{ return true} } function isHuisnummer(form){ if (form.huisnummer.value == ""){ return false} else{ return true} } function isPostcode(form){ if (form.postcode.value == ""){ return false} else{ return true} } function isWoonplaats(form){ if (form.woonplaats.value == ""){ return false} else{ return true} } function isTelefoon(form){ if(form.telefoon.value == ""){ return false} else{ return true} } function isEmail(form){ if ((form.email.value == "" || form.email.value.indexOf('@', 0) == -1) || form.email.value.indexOf('.') == -1) { return false} else{ return true} } function isCursusnummer(form){ if(form.cursusnummer.value == ""){ return false} else{ return true} }function isCursusnaam(form){ if(form.cursusnaam.value == ""){ return false} else{ return true} }function isDag(form){ if(form.dag.value == ""){ return false} else{ return true} }function isTijd(form){ if(form.tijd.value == ""){ return false} else{ return true} }function isLocatie(form){ if(form.locatie.value == ""){ return false} else{ return true} }function isOpmerkingen(form){ if(form.opmerkingen.value == ""){ return false} else{ return true} } //--> </script> </head> <body> <p><strong>Aanmelden voor een cursus:</strong></p> <p>Vul onderstaand formulier in en klik op verzenden. <br> E&eacute;n formulier per persoon en &eacute;&eacute;n cursus per formulier, dit om vergissingen te voorkomen.<br> Uitprinten en per post sturen naar <strong>55 Plus Educatief, Paul Krugerlaan 55 5652 GH Eindhoven</strong> mag natuurlijk ook.<br> </p> <form face="Verdana" action="mailto:formulier@chello.nl?subject=Antwoordformulier" METHOD="POST" NAME="Formulier" ENCtype="text/plain" WRAP="PHYSICAL";> <table width="750" border="0" align="center"> <tr> <td width="136"> <div align="right"><strong>uw gegevens:</strong></div></td> <tr> <td><div align="right">naam: </div></td> <td colspan="2"><input type="text" name="naam" size="40"></td> </tr> <tr> <td><div align="right">voorletter:</div></td> <td colspan="2"><input type="text" name="voorletters" size="40"></td> </tr> <tr> <td> <div align="right">straat:</div></td> <td colspan="2"><input type="text" name="straat" size="40"> </td> </tr> <tr> <td> <div align="right">huisnummer:</div></td> <td colspan="2"> <input type="text" name="huisnummer" size="40"> </td> </tr> <tr> <td> <div align="right">postcode:</div></td> <td colspan="2"><input type="text" name="postcode" size=40></td> </tr> <tr> <td> <div align="right">woonplaats:</div></td> <td colspan="2"> <input type="text" name="woonplaats" size="40"> </td> </tr> <tr> <td> <div align="right">telefoon:</div></td> <td colspan="2"> <input type="text" name="telefoon" size="40"> </td> </tr> <tr> <td><div align="right">e-mailadres:</div></td> <td colspan="2"><input type="text" name="e-mailadres" size="40"></td> </tr> <tr> <td> <div align="right"></div></td> <td colspan="2">&nbsp;</td> </tr> <tr> <td><div align="right"><strong>cursusgegevens:</strong></div></td> <td colspan="2">schrijft in op de cursus:</td> </tr> <tr> <td valign=> <div align="right"> <div align="right"></div> </div></td> <td width="101">cursusnr: </td> <td width="503"> <input type="text" name="cursusnummer" size="4" maxlength="5"> cursusnaam <input type="text" name="cursusnaam" size="41" maxlength="120"></td> </tr> <tr> <td valign="top"><div align="right"></div></td> <td>cursusdag: </td> <td><select name="dag" size="1"> <option>kies de juiste dag</option> <option>maandag</option> <option>dinsdag</option> <option>woensdag</option> <option>donderdag</option> <option>vrijdag</option> </select></td> </tr> <tr> <td valign="top">&nbsp;</td> <td>aanvangstijd: </td> <td><input type="text" name="tijd" size="9"></td> </tr> <tr> <td valign="top">&nbsp;</td> <td>locatie: </td> <td><select name="locatie" size="1"> <option>kies de juiste locatie:</option> <option>55 Plus Kwartier, Paul Krugerlaan</option> <option>Heidehonk, Woenselse Heide</option> <option>De Uitwijk, Gen. Pattonlaan</option> <option>De Werf, vd Werffstraat</option> </select></td> </tr> <tr> <td valign="top"><div align="right">opmerkingen:<br> </div></td> <td colspan="2"><textarea name="opmerkingen" rows="3" cols="40"></textarea></td> </tr> <tr> <td height="64" valign="top">&nbsp;</td> <td colspan="2"> <p> <input type="button" name="Reaktie" value="Verzenden" onfocus="this.blur()" onClick="everything(this.form)";> <input type="reset" value="Wissen"> </p></td> </tr> </table> </form>[/quote:11f5129144] dank
Link naar reactie
Ik moet toegeven dat het even worstelen door de code was.. persoonlijk zou mijn aanpak geheel anders zijn, maar ik zal je eerst zeggen waarom het niet werkt. Dan heeft meerdere redenen.. Je probeert van de selectbox 'dag' de value uit te lezen, dat kan niet, want een selectbox heeft geen values, maar options. En die options hebben eventueel values, in jouw geval niet. de juiste manier is dan: [code:1:53979348a9]form.dag.options[form.dag.selectedIndex].text[/code:1:53979348a9] Maar aangezien je alleen maar wil weten of de gebruiker wel iets gekozen heeft, behalve de eerste optie is dit als test voldoende: [code:1:53979348a9]if(form.dag.selectedIndex > 0)[/code:1:53979348a9] Hetzelfde geldt voor locatie. Verder roep je ergens de functie doit() aan. Ik zie die verder niet gedefinieerd staan. [code:1:53979348a9]<form face="Verdana" action="mailto:formulier@chello.nl?subject=Antwoordformulier" METHOD="POST" NAME="Formulier" ENCtype="text/plain" WRAP="PHYSICAL";> [/code:1:53979348a9] Wat doen die face="verdana" en ; aan het einde in de tag? Kijk verder ook nog eens goed naar je script en dan vooral hoe vaak je die verschillende kleine isNaam, isLetter enz. functies aanroept en of dat niet misschien niet te vaak is. Ook zouden heel veel van die functies volgens mij in 1 functie kunnen [code:1:53979348a9]function isEmpty(inputvalue) { if(inputvalue == '') return false; else return true; }[/code:1:53979348a9] Het zal er niet beter door gaan werken, maar het is wel netter en makkelijker om fouten op te sporen.
Link naar reactie
dank voor je uitleg, ik heb het script ergens vandaar gehaald en proberen aan te passen maar zoals je wellicht snapt weet ik niet goed wat ik doe..... :-? het voorbeeldscript werkt wel, dus ik dacht een paar velden erbij en het zou moeten werken...helaas niet dus. dat van die options is logisch, maar ook na de door jou aangegeven aanpassingen werkt het niet. ík ploeter voort.....
Link naar reactie
[code:1:3c05691795]<html> <head> <title>webformulier</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script type="text/javascript"> var err = 0; var errorMessages = new Array(); // boodschap als er een waarde fout is. De key bestaat uit de name attribuut van een formulierelement errorMessages['naam'] = '\nuw naam'; errorMessages['voorletters'] = "\nuw voorletter(s)"; errorMessages['straat'] = "\nuw straatnaam"; errorMessages['huisnummer'] = "\nuw huisnummer"; errorMessages['postcode'] = "\nuw postcode"; errorMessages['woonplaats'] = "\nuw woonplaats"; errorMessages['telefoon'] = "\nuw telefoonnummer"; errorMessages['emailadres'] = "\nuw e-mail adres"; errorMessages['cursusnummer'] = "\nuw cursusnummer"; errorMessages['cursusnaam'] = "\nuw cursusnaam"; errorMessages['dag'] = "\nuw dag"; errorMessages['tijd'] = "\nde aanvangsTijd"; errorMessages['locatie'] = "\nuw locatie"; errorMessages['opmerkingen'] = "\nuw Opmerkingen"; function checkForm(f) { var txt = 'De volgende gegevens zijn niet juist ingevuld:'; var l = f.elements.length; // error op 0 zetten err = 0; // op zoek naar fouten bij alle elementen van het formulier for(var i = 0; i < l; i++) { // eerst kijken of het geen emailadres is if(f.elements[i].name == 'emailadres') { txt += isEmail(f.elements[i]); } // input elementen van het type text of een textarea else if(f.elements[i].type == 'text' || f.elements[i].type == 'textarea') { txt += isEmpty(f.elements[i]); } // selection elementen else if(f.elements[i].type.indexOf('select') > -1) { txt += isSelected(f.elements[i]); } // overige elementen (buttons e.d.) else continue; } // foutje... if(err == 1) { alert(txt); return false; } // alles ok! else { return true; } } function isEmpty(el) { if(el.value == '') { err = 1; return errorMessages[el.name]; } else return ''; } function isSelected(el) { if(el.selectedIndex == 0) { err = 1; return errorMessages[el.name]; } else return ''; } function isEmail(el) { if (el.value == "" || el.value.indexOf('@', 0) == -1 || el.value.indexOf('.') == -1) { err = 1; return errorMessages[el.name]; } else return ''; } </script> <style type="text/css"> label { text-align: right; width: 100%; height: 100%; display: block; float: left; } label.altLabel { display: inline; float: none; text-align: left; } </style> </head> <body> <p><strong>Aanmelden voor een cursus:</strong></p> <p>Vul onderstaand formulier in en klik op verzenden. <br> E&eacute;n formulier per persoon en &eacute;&eacute;n cursus per formulier, dit om vergissingen te voorkomen.<br> Uitprinten en per post sturen naar <strong>55 Plus Educatief, Paul Krugerlaan 55 5652 GH Eindhoven</strong> mag natuurlijk ook.<br></p> <form action="mailto:formulier@chello.nl?subject=Antwoordformulier" method="POST" name="Formulier" enctype="text/plain" WRAP="PHYSICAL" onsubmit="return checkForm(this)"> <table border="1" width="750" border="0" align="center"> <tr> <td width="101" align="right"><strong>uw gegevens:</strong></td> <td colspan="2">&nbsp;</td> <tr> <td><label for="naam">naam:</label></td> <td colspan="2"><input type="text" id="naam" name="naam" size="40"></td> </tr> <tr> <td><label for="voorletters">voorletter:</label></td> <td colspan="2"><input type="text" id="voorletters" name="voorletters" size="40"></td> </tr> <tr> <td><label for="straat">straat:</label></td> <td colspan="2"><input type="text" id="straat" name="straat" size="40"></td> </tr> <tr> <td><label for="huisnummer">huisnummer:</label></td> <td colspan="2"><input type="text" id="huisnummer" name="huisnummer" size="40"></td> </tr> <tr> <td><label for="postcode">postcode:</label></td> <td colspan="2"><input type="text" id="postcode" name="postcode" size=40></td> </tr> <tr> <td><label for="woonplaats">woonplaats:</label></td> <td colspan="2"><input type="text" id="woonplaats" name="woonplaats" size="40"></td> </tr> <tr> <td><label for="telefoon">telefoon:</label></td> <td colspan="2"><input type="text" id="telefoon" name="telefoon" size="40"></td> </tr> <tr> <td><label for="emailadres">e-mailadres:</label></td> <td colspan="2"><input type="text" id="emailadres" name="emailadres" size="40"></td> </tr> <tr> <td colspan="3">&nbsp;</td> </tr> <tr> <td align="right"><strong>cursusgegevens:</strong></td> <td colspan="2">schrijft in op de cursus:</td> </tr> <tr> <td> &nbsp; </td> <td><label for="cursusnummer" class="altLabel">cursusnr:</label></td> <td> <input type="text" id="cursusnummer" name="cursusnummer" size="4" maxlength="5"> <label for="cursusnaam" class="altLabel">cursusnaam</label> <input type="text" id="cursusnaam" name="cursusnaam" size="41" maxlength="120"> </td> </tr> <tr> <td>&nbsp;</td> <td><label for="dag" class="altLabel">cursusdag:</label></td> <td> <select id="dag" name="dag" size="1"> <option>kies de juiste dag</option> <option>maandag</option> <option>dinsdag</option> <option>woensdag</option> <option>donderdag</option> <option>vrijdag</option> </select> </td> </tr> <tr> <td>&nbsp;</td> <td><label for="tijd" class="altLabel">aanvangstijd:</label></td> <td><input type="text" id="tijd" name="tijd" size="9"></td> </tr> <tr> <td>&nbsp;</td> <td><label for="locatie" class="altLabel">locatie:</label></td> <td> <select id="locatie" name="locatie" size="1"> <option>kies de juiste locatie:</option> <option>55 Plus Kwartier, Paul Krugerlaan</option> <option>Heidehonk, Woenselse Heide</option> <option>De Uitwijk, Gen. Pattonlaan</option> <option>De Werf, vd Werffstraat</option> </select> </td> </tr> <tr> <td valign="top"> <label for="opmerkingen">opmerkingen:</label> </td> <td colspan="2"> <textarea id="opmerkingen" name="opmerkingen" rows="3" cols="40"></textarea> </td> </tr> <tr> <td height="64" valign="top">&nbsp;</td> <td colspan="2"> <p> <input type="submit" value="Verzenden" onfocus="this.blur()"> <input type="reset" value="Wissen"> </p> </td> </tr> </table> </form> </body> </html> [/code:1:3c05691795]
Link naar reactie
klopt, zo maar iets weglaten werkt niet. Je kunt, net als het emailadres, velden die je wilt weglaten (zoals opmerkingen) boven de andere checks (type = text/textarea, of type = select) toevoegen. Oftewel als je een nieuwe inputveld toevoegt: [code:1:88d15820f3] if(f.elements[i].name == 'nieuwe inputname' || f.elements[i].name == 'andere inputname zonder controle') { continue; } [/code:1:88d15820f3] (Vergeet dan niet van 'if' 'else if' te maken bij de regel voor de email controle. Als het alleen om het opmerkingenveld gaat in dit specifieke geval, dan kun je van [code:1:88d15820f3] else if(f.elements[i].type == 'text' || f.elements[i].type == 'textarea') [/code:1:88d15820f3] ook maken [code:1:88d15820f3] else if(f.elements[i].type == 'text') [/code:1:88d15820f3] het opmerkingenveld wordt dan niet gecontroleerd.
Link naar reactie

Om een reactie te plaatsen, moet je eerst inloggen

Gast
Reageer op dit topic

×   Geplakt als verrijkte tekst.   Herstel opmaak

  Er zijn maximaal 75 emoji toegestaan.

×   Je link werd automatisch ingevoegd.   Tonen als normale link

×   Je vorige inhoud werd hersteld.   Leeg de tekstverwerker

×   Je kunt afbeeldingen niet direct plakken. Upload of voeg afbeeldingen vanaf een URL in

  • Populaire leden

    Er is nog niemand die deze week reputatie heeft ontvangen.

  • Leden

    Geen leden om te tonen

×
×
  • Nieuwe aanmaken...