[JavaScript] Pflichtfelder in Formular

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [JavaScript] Pflichtfelder in Formular

    Hi!

    Ich hab folgendes Formular gebastelt! Nun möchte ich die Pflichtfelder "Name", "email" und "Kommentar" mit der funktion chkformular überprüfen.
    Hab dazu folgenden Javascript-code verwendet!

    Leider funktioniert die Überprüfung nicht!
    Ich bin mir nicht sicher ob ich die chkformular funktion an der richtigen Stelle aufrufe und ob im Javascript bereich alles richtig ist?!?
    Besonders bei der if-Bedingung...!

    Wäre toll wenn ihr euch das mal anschauen könntet!

    gruß Flo

    Die datei heißt index.html! Weiß nicht ob das eine rolle spielt in verbindung mit der if-Bedingung!?


    <head>
    <title></title>
    <script type="text/javascript">
    function chkFormular()
    {
    if(document.Formular.name.value == "") {
    alert("Bitte Ihren Namen eingeben!");
    document.Formular.name.focus();
    return false;
    }
    if(document.Formular.email.value == "") {
    alert("Bitte Ihre E-Mail-Adresse eingeben!");
    document.Formular.email.focus();
    return false;
    }
    if(document.Formular.email.value.indexOf('@') == -1) {
    alert("Keine E-Mail-Adresse!");
    document.Formular.email.focus();
    return false;
    }
    if(document.Formular.comment.value == "") {
    alert("Bitte einen Kommentar eingeben!");
    document.Formular.comment.focus();
    return false;
    }
    }
    </script>

    </head>
    <body>
    <p align ="center"><img src="logo.gif"></p></align><br>

    <FORM ACTION = "wp_project.php" METHOD = "POST" onSubmit="return chkFormular()">
    <table width="95%" border="0" cellspacing="0" cellpadding="3" align="center">
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Anrede:</font></div>
    </td>
    <td width="70%">
    <div align="left">
    <select name ="anrede">
    <option value ="Herr">Herr</option>
    <option value ="Frau">Frau</option>
    <option value ="Firma">Firma</option>
    </select>
    </div>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Name:</font></div>
    </td>
    <td width="70%">
    <div align="left">
    <input type="text" name="name" size="46" maxlength="55">
    </div>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Email-Adresse:</font></div>
    </td>
    <td width="70%">
    <div align="left">
    <input type ="text" name="email" size="46" maxlength="55">
    </div>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Kundennummer:</font></div>
    </td>
    <td width="70%">
    <div align="left">
    <input type="text" name="kdnr" size="20" maxlength="15">
    </div>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Auftragsnummer:</font></div>
    </td>
    <td width="70%">
    <div align="left">
    <input type="text" name="ordernr" size="20" maxlength="15">
    </div>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Maschinennummer:</font></div>
    </td>
    <td width="70%">
    <div align="left">
    <input type="text" name="maschinennr" size="20" maxlength="15">
    </div>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Produktkategorie:</font></div>
    </td>
    <td width="70%">
    <div align="left">
    <select name ="range">
    <option value ="Etagenbacköfen">Etagenbacköfen</option>
    <option value ="Beschickungstechnik">Beschickungstechnik</option>
    <option value ="Produktkategorie 3">Produktkategorie 3</option>
    <option value ="Produktkategorie n">Produktkategorie n</option>
    </select>
    </div>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Kommentar:</font></div>
    </td>
    <td width="70%">
    <textarea name="comment" cols="50%" rows="6"></textarea>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial" size="2">Dateianhang:</font></div>
    </td>
    <td width="70%">
    <div align="left">
    <input name="attachment" type="file" size="30" maxlength="100000" accept="text/*">
    </div>
    </td>
    </tr>
    <tr>
    <td width="30%">
    <div align="right"><font face="Arial"><font face="Arial"><font size="2"><font size="3"><font size="2"></font></font></font></font></font></div>
    </td>
    <td width="70%">
    <div align ="left">
    <input type="Submit" name="OnSubmit" value="abschicken">
    <input type="reset" name="reset" value="löschen">
    </div>
    </td>
    </tr>
    </table>
    <p>&nbsp;</p></form>



    </body>
    </html>

  • #2
    versuchs mal mit onSubmit="return chkFormular(this)" in der Form

    Kommentar


    • #3
      if(document.Formular.name.value == "")

      name ist eine Eigenschaft des form-Objekts.

      Alternativen:
      - Feld umbenennen (z.B. 'pname')
      - document.Formular.elements['name'].value
      - getElementsByName('name')[0].value
      - getElementById('name') und dem Input zusätzlich zum Namen noch die id="name" spendieren.
      mein Sport: mein Frühstück: meine Arbeit:

      Sämtliche Code-Schnipsel sind im Allgemeinen nicht getestet und werden ohne Gewähr auf Fehlerfreiheit und Korrektheit gepostet.

      Kommentar


      • #4
        danke erstmal für die schnelle antwort!

        bin mir nicht sicher ob ich das jetzt verstanden habe!

        in meinem Formular hat ja das Feld Email-Adresse den namen "email"!
        dann muss dass doch mit if(....email.value=="") stimmen,oder?

        wie sieht das mit dem if(document.formular...) aus???

        Woher kommt das "document" und das "formular"?!?!?

        Gruß Flo

        Kommentar


        • #5
          dein script erwartet eindeutige angaben:

          "Formular" ist erstmal undefiniert, woher soll JS also wissen,
          was du prüfen willst?

          Ändere mal den form-tag:
          Code:
          <form name="Formular" action="....
          dann kannst du so drauf zugreifen:

          document.Formular.email.value
          oder
          document.forms[0].elements[NummerdesElements].value
          oder
          document.forms['Formular'].elements['email'].value

          das ergebnis sollte immer derselbe wert sein.
          Kissolino.com

          Kommentar

          Lädt...
          X