Vraag & Antwoord

Webprogrammeren & scripting

javascript veldcontrole inschrijfformulier

6 antwoorden
  • 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én formulier per persoon en éé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"> </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"> </td> <td>aanvangstijd: </td> <td><input type="text" name="tijd" size="9"></td> </tr> <tr> <td valign="top"> </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"> </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
  • 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.
  • 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.....
  • [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én formulier per persoon en éé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"> </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"> </td> </tr> <tr> <td align="right"><strong>cursusgegevens:</strong></td> <td colspan="2">schrijft in op de cursus:</td> </tr> <tr> <td>   </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> </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> </td> <td><label for="tijd" class="altLabel">aanvangstijd:</label></td> <td><input type="text" id="tijd" name="tijd" size="9"></td> </tr> <tr> <td> </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"> </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]
  • tjee, bedankt, je maakt het me zo wel makkelijk....! :lol: enne ...het werkt ! (tuurlijk zal je nu wel zeggen :wink: )
  • en kan ik nu ook een of meerdere velden zonder controle laten invullen? zomaar iets weglaten werkt natuurlijk niet :roll:

Beantwoord deze vraag

Weet jij het antwoord op deze vraag? Registreer of meld je aan met je account

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.