Op deze website gebruiken we cookies om content en advertenties te personaliseren, om functies voor social media te bieden en om ons websiteverkeer te analyseren. Ook delen we informatie over uw gebruik van onze site met onze partners voor social media, adverteren en analyse. Deze partners kunnen deze gegevens combineren met andere informatie die u aan ze heeft verstrekt of die ze hebben verzameld op basis van uw gebruik van hun services. Meer informatie.

Akkoord

Vraag & Antwoord

Webprogrammeren & scripting

javascript veldcontrole inschrijfformulier

maIRnaairruJ
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 += "
    uw naam"}
    if(isLetter(form) == false){
    text += "
    uw voorletter(s)"}
    if(isStraatnaam(form) == false){
    text += "
    uw straatnaam"}
    if(isHuisnummer(form) == false){
    text += "
    uw huisnummer"}
    if(isPostcode(form) == false){
    text += "
    uw postcode"}
    if(isWoonplaats(form) == false){
    text += "
    uw woonplaats"}
    if (isTelefoon(form) == false){
    text += "
    uw telefoonnummer"}
    if(isEmail(form) == false){
    text += "
    uw e-mail adres"}
    if (isCursusnummer(form) == false){
    text += "
    uw cursusnummer"}
    if (isCursusnaam(form) == false){
    text += "
    uw cursusnaam"}
    if (isDag(form) == false){
    text += "
    uw dag"}
    if (isTijd(form) == false){
    text += "
    uw tijd"}
    if (isLocatie(form) == false){
    text += "
    uw locatie"}
    if (isOpmerkingen(form) == false){
    text += "
    uw 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
  • 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'] = '
    uw naam';
    errorMessages['voorletters'] = "
    uw voorletter(s)";
    errorMessages['straat'] = "
    uw straatnaam";
    errorMessages['huisnummer'] = "
    uw huisnummer";
    errorMessages['postcode'] = "
    uw postcode";
    errorMessages['woonplaats'] = "
    uw woonplaats";
    errorMessages['telefoon'] = "
    uw telefoonnummer";
    errorMessages['emailadres'] = "
    uw e-mail adres";
    errorMessages['cursusnummer'] = "
    uw cursusnummer";
    errorMessages['cursusnaam'] = "
    uw cursusnaam";
    errorMessages['dag'] = "
    uw dag";
    errorMessages['tijd'] = "
    de aanvangsTijd";
    errorMessages['locatie'] = "
    uw locatie";
    errorMessages['opmerkingen'] = "
    uw 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]
  • 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

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