Eric: Pflichtfelder in Formularen!

Hallo Zusammen.

Meine Frage eilt ein wenig, muss das heute nacht noch fertig stellen.

Wie kann ich denn in einem Formular sämmtliche Felder als Pflichtfelder definieren? Also dass sie ausgefüllt werden müssen? Am besten mit Fehlerhinweis beim Absenden dass da ein feld vergessen wurde. Muss nix unheimlich kompliziertes sein.

Bitte ganz schnell antworten *fleh* gerne auch per Mail oder ICQ (84474412) DANKE!

Eric

  1. Hallo Zusammen.

    Meine Frage eilt ein wenig, muss das heute nacht noch fertig stellen.

    Wie kann ich denn in einem Formular sämmtliche Felder als Pflichtfelder definieren? Also dass sie ausgefüllt werden müssen? Am besten mit Fehlerhinweis beim Absenden dass da ein feld vergessen wurde. Muss nix unheimlich kompliziertes sein.

    Bitte ganz schnell antworten *fleh* gerne auch per Mail oder ICQ (84474412) DANKE!

    Eric

    schau mal auf den Quelltext- das sollte helfen
    mit java script werden alle Felder geprüft

    <Script language="JavaScript">
     <!--

    function plausibel()
     {

    var Fehlermeldung = "";

    if (document.kontakt.familienname.value == "")
          Fehlermeldung = Fehlermeldung + "Name fehlt.\n";

    if (document.kontakt.vorname.value == "")
          Fehlermeldung = Fehlermeldung + "Vorname fehlt.\n";

    if (document.kontakt.strasse.value == "")
          Fehlermeldung = Fehlermeldung + "Strasse fehlt.\n";
        if (document.kontakt.plz.value == "")
          Fehlermeldung = Fehlermeldung + "PLZ fehlt.\n";
        else
          if (isNaN(document.kontakt.plz.value)|| (document.kontakt.plz.value.indexOf(".") != -1)
        || (document.kontakt.plz.value.length != 5))

    Fehlermeldung = Fehlermeldung +"falsche plz.\n";

    if (document.kontakt.ort.value == "")
              Fehlermeldung = Fehlermeldung + "Ort fehlt.\n";
        if (document.kontakt.mail.value == "")
          Fehlermeldung = Fehlermeldung + "e-mail fehlt.\n";
        else
        {
         pos = document.kontakt.mail.value.indexOf("@");

    switch(pos)
        {
          case -1:
          Fehlermeldung = Fehlermeldung + "@ vergessen!";
       break;

    case 0:
       Fehlermeldung = Fehlermeldung + "Benutzerkonto fehlt";
       break;

    default:
       if (pos == document.kontakt.mail.value.length-1)
       Fehlermeldung = Fehlermeldung + "Domain vergessen";
       else
       if (document.kontakt.mail.value.lastIndexOf("@") !=pos)
       Fehlermeldung = Fehlermeldung + "mehr als ein @";

    break;

    }

    }
        if (Fehlermeldung != "")
        {
           alert(Fehlermeldung);
        return false;
        }
        else
           return true;

    }

    //-->

    </script>

    </head>

    <body>
    <Form Method="get" Action="beispiel11.html"
    onSubmit="return plausibel();" Name="kontakt">
    Fam.-Name: <Input Name="familienname"> <BR>
    Vorname(n): <Input Name="vorname"> <BR>
    Sraße: <Input Name="strasse"> <BR>
    PLZ: D- <Input Name="plz" Size=5 Maxlenght=5>
    Ort: <Input Name="ort"> <BR>
    e-Mail: <Input Name="mail"> <BR>
    <BR>
    <Input Type="submit" Value="senden">
    <Input Type="button" Value="zurück" onClick="history.back()">

    </body>
    </html>

    Gruß
    Stephan

    1. Danke für die schnelle Antwort!

      Aber wie schaut das bei <option> Feldern oder Checkboxen aus?

      Ich hoff ich krieg das zum laufen. Habs noch nicht ganz entschlüsselt. Hast du irgend nen Instant messenger evtl? ICQ oder so?

      Grüssle

      vom verzweiffelten Eric

      Hallo Zusammen.

      Meine Frage eilt ein wenig, muss das heute nacht noch fertig stellen.

      Wie kann ich denn in einem Formular sämmtliche Felder als Pflichtfelder definieren? Also dass sie ausgefüllt werden müssen? Am besten mit Fehlerhinweis beim Absenden dass da ein feld vergessen wurde. Muss nix unheimlich kompliziertes sein.

      Bitte ganz schnell antworten *fleh* gerne auch per Mail oder ICQ (84474412) DANKE!

      Eric

      schau mal auf den Quelltext- das sollte helfen
      mit java script werden alle Felder geprüft

      <Script language="JavaScript">
      <!--

      function plausibel()
      {

      var Fehlermeldung = "";

      if (document.kontakt.familienname.value == "")
            Fehlermeldung = Fehlermeldung + "Name fehlt.\n";

      if (document.kontakt.vorname.value == "")
            Fehlermeldung = Fehlermeldung + "Vorname fehlt.\n";

      if (document.kontakt.strasse.value == "")
            Fehlermeldung = Fehlermeldung + "Strasse fehlt.\n";
          if (document.kontakt.plz.value == "")
            Fehlermeldung = Fehlermeldung + "PLZ fehlt.\n";
          else
            if (isNaN(document.kontakt.plz.value)|| (document.kontakt.plz.value.indexOf(".") != -1)
          || (document.kontakt.plz.value.length != 5))

      Fehlermeldung = Fehlermeldung +"falsche plz.\n";

      if (document.kontakt.ort.value == "")
                Fehlermeldung = Fehlermeldung + "Ort fehlt.\n";
          if (document.kontakt.mail.value == "")
            Fehlermeldung = Fehlermeldung + "e-mail fehlt.\n";
          else
          {
           pos = document.kontakt.mail.value.indexOf("@");

      switch(pos)
          {
            case -1:
            Fehlermeldung = Fehlermeldung + "@ vergessen!";
         break;

      case 0:
         Fehlermeldung = Fehlermeldung + "Benutzerkonto fehlt";
         break;

      default:
         if (pos == document.kontakt.mail.value.length-1)
         Fehlermeldung = Fehlermeldung + "Domain vergessen";
         else
         if (document.kontakt.mail.value.lastIndexOf("@") !=pos)
         Fehlermeldung = Fehlermeldung + "mehr als ein @";

      break;

      }

      }
          if (Fehlermeldung != "")
          {
             alert(Fehlermeldung);
          return false;
          }
          else
             return true;

      }

      //-->

      </script>

      </head>

      <body>
      <Form Method="get" Action="beispiel11.html"
      onSubmit="return plausibel();" Name="kontakt">
      Fam.-Name: <Input Name="familienname"> <BR>
      Vorname(n): <Input Name="vorname"> <BR>
      Sraße: <Input Name="strasse"> <BR>
      PLZ: D- <Input Name="plz" Size=5 Maxlenght=5>
      Ort: <Input Name="ort"> <BR>
      e-Mail: <Input Name="mail"> <BR>
      <BR>
      <Input Type="submit" Value="senden">
      <Input Type="button" Value="zurück" onClick="history.back()">

      </body>
      </html>

      Gruß
      Stephan

      1. Danke für die schnelle Antwort!

        Aber wie schaut das bei <option> Feldern oder Checkboxen aus?

        Habe ich noch nicht bearbeitet, aber das gegebene schon mal erweitert:

        • erweiterte E-Mail-Überprüfung
        • setzt im Fehlerfalle den Focus() in's erste falsche Feld
        • Tabellenlayout
        • farbige Buttons (IE)
        • Schiftart (siehe Anmerkung bei font)

        <Script language="JavaScript">
        <!--

        // Global, ermöglicht Zugriff in function plausibel() UND function falsch()
        var Fehlermeldung;
        var Focusfeld;

        function plausibel()
        {

        var form = document.kontakt;  // hier Form-Namen angeben

        var feld;

        Fehlermeldung = "";
          Focusfeld = null;

        feld = form.familienname;
          if (feld.value == "")
            falsch (feld, "Name fehlt");

        feld = form.vorname;
          if (feld.value == "")
            falsch (feld, "Vorname fehlt");

        feld = form.strasse;
          if (feld.value == "")
            falsch (feld, "Straße fehlt");

        feld= form.plz;
          var plz=feld.value;
          if (plz == "")
            falsch (feld, "PLZ fehlt");
          else
          if ( isNaN(plz) )
            falsch (feld, "PLZ ist keine Zahl");
          else
          if ( plz.indexOf(".") != -1 )
            falsch (feld, "PLZ darf keinen Punkt enthalten");
          else
          if (plz.length != 5)
            falsch (feld, "PLZ falsch (keine 5 Stellen)");

        feld = form.ort
          if (feld.value == "")
            falsch (feld, "Ort fehlt");

        feld = form.mail
          var email=feld.value
          if (email == "")
            falsch (feld, "E-Mail fehlt");
          else
          {
            posat = email.indexOf("@");
            switch(posat)
            {
              case -1:
                falsch (feld, "E-Mail: @ fehlt");
              break;

        case 0:
                falsch (feld, "E-Mail: Benutzerkonto fehlt");
              break;

        default:
                posdot = email.lastIndexOf(".");
                if (email.lastIndexOf("@") !=posat)
                  falsch (feld, "E-Mail: mehr als ein @");
                else
                if (posat == email.length-1 || posdot == posat+1)
                  falsch (feld, "E-Mail: Domain fehlt");
                else
                if (posdot < posat || posdot == email.length-1)  // posdot < posat schließt auch posdot==-1 ein
                  falsch (feld, "E-Mail: Top-Leve-Domain (z. B. ".de") fehlt");
              break;
            }
          }

        if (Fehlermeldung != "")
          {
            // Fehlermeldung = "FEHLER:\n" + Fehlermeldung;
            alert(Fehlermeldung);
            Focusfeld.focus();
            return false;  // darf ausnahmsweise nicht 0 sein, würde dann troztdem gesendet
          }
          else
            // Verhindert verfrühtes Absenden bei Druck auf Return in einem Eingabefeld:
            return confirm("Formular jetzt absenden?");
            // return true;  // sonst (ohne Abfrage)

        }

        function falsch (feld, text) // Greift auf Variable Fehlermeldung und Focusfeld zurück
        {
          if (Focusfeld == null)
            Focusfeld = feld;
          Fehlermeldung += text + ".\n";
        }

        //-->
        </script>

        </head>

        <body onload="document.forms[0].elements[0].focus()">

        <font face="Arial,sans-serif"><!-- NS nicht in Tabellen, muß dort in jede TD -->

        <Form Method="get" Action="beispiel11.html"
          onSubmit="return plausibel();" Name="kontakt">
          <Table border=0 cellpadding=0 cellspacing=0>
            <TR><TD>Fam.-Name: </TD><TD><Input Name="familienname"> *)</TD></TR>
            <TR><TD>Vorname(n): </TD><TD><Input Name="vorname"> *)</TD></TR>
            <TR><TD>Sraße: </TD><TD><Input Name="strasse"> *)</TD></TR>
            <TR><TD>PLZ: </TD><TD>D-<Input Name="plz" Size=5 Maxlength=5> *)  
              Ort: <Input Name="ort"> *)</TD>
            </TR>
            <TR><TD valign="top">e-Mail: </TD><TD><Input Name="mail"> *)<BR>
              Ihre E-Mail-Adresse wird verwendet:<br>
              - für die Rückantwort<br>
              - für den Newsletter<br>
              - für Angebote</TD>
            </TR>
          </Table>
          <BR>
          *) Pflichtfelder<br>
          <BR>
          <!-- NS4 zeigt Style nicht an -->
          <Input Type="submit" Value="Absenden" Style="background-color:#00FF00">
          <Input Type="reset" Value="Löschen" Style="background-color:#FF4400">
        </Form>

        <p>
        Ein Benutzer gibt seine E-Mail-Adresse nur dann freiwillig an, wenn er genau weiß,
        was damit geschieht.
        </p>

        <p>
        Bei abgeschaltetem Scripting erfolgt keine Überprüfung mehr.
        Dann muß das Server-Script weiter prüfen.
        Im Fehlerfalle kann es eine Fehlerseite mit einem "Zurück"-Button ausgeben
        (manchmal werden aber bei Zurück die Eingaben gelöscht)
        oder die Seite neu aufbauen, das ist aber sehr schwierig und wartungsaufwändig,
        weil dann 2 Layouts parallel gepflegt werden müssen (hier und im Server-Script).
        </p>

        </body>
        </html>