cheminar: Gibt es eine andere Lösung?

Hallo Leute,

ich dachte warum nutzt du nicht mal dieses Forum :) ( sonst immer html.de)

Hier ist mal mein html code(nur im Zusammenhang des JavaScripts):

  
<form onsubmit="return checkForm();">  
    <input type="text" placeholder="Vorname" class="regstyle" name="Vorname" id="Vorname"/>  
    <input type="text" placeholder="Nachname" class="regstyle" name="Nachname" id="Nachname"/>  
    <input type="text" placeholder="e-Mail" class="regstyle" name="e-Mail" id="e-Mail" id="email" />  
    <input type="text" placeholder="e-Mail erneut" class="regstyle" name="e-Mail erneut" id="emailre"/>  
    <input type="password" placeholder="Passwort" class="regstyle" name="Passwort" id="passwort"/>  
    <input type="password" placeholder="Passwort erneut" class="regstyle" name="Passwort erneut" id="passwortre"/>  
  
<div id="msginput">Du musst alle Felder ausgef&uuml;llt haben.</div>  
  
  
</div>  
  
<div class="sendbuttonreg">  
<button type="submit" name="Registrieren" id="sendbuttonreg">Registrieren</button>  
</div>  
  
</form>  

Und hier der JavaScript:

  
function checkForm(){  
if (document.getElementById("Vorname").value==""){  
document.getElementById("msginput").style.display="block";  
return(false);  
}  
else{  
return(true);  
}  
}  
  

Soo, funktioniert einwandfrei -> Wenn Vornamefeld leer steht und das Formular abgeschickt wird, dann erscheint die Fehlmeldung dass alle Felder ausgefüllt sein müssen.

Wie binde ich aber die anderen Felder mit ein?
Mit document.getElementByTagName und .getAttribute leider kein Erfolg ( Warum auch immer?? Scheint eigentlich dass logischste zu sein oder?? )

Hoffe sehr auf eine Antwort, hänge seit einigen Stunden dran.

MfG und Gute Nacht

Cheminar

  1. Hallo!

    Soo, funktioniert einwandfrei -> Wenn Vornamefeld leer steht und das Formular abgeschickt wird, dann erscheint die Fehlmeldung dass alle Felder ausgefüllt sein müssen.

    Wie binde ich aber die anderen Felder mit ein?

    Was meinst du mit »einbinden«? Willst du auch deren Wert überprüfen? Das kannst du auf dieselbe Art und Weise machen, wie du den Wert des Vorname-Feldes prüfst.

    Die anderen Felder haben ebenfalls eine ID, also kannst du sie ebenfalls über getElementById ansprechen. Oder missverstehe ich dich?

    Mathias

    1. Hallo!

      Soo, funktioniert einwandfrei -> Wenn Vornamefeld leer steht und das Formular abgeschickt wird, dann erscheint die Fehlmeldung dass alle Felder ausgefüllt sein müssen.

      Wie binde ich aber die anderen Felder mit ein?

      Was meinst du mit »einbinden«? Willst du auch deren Wert überprüfen? Das kannst du auf dieselbe Art und Weise machen, wie du den Wert des Vorname-Feldes prüfst.

      Die anderen Felder haben ebenfalls eine ID, also kannst du sie ebenfalls über getElementById ansprechen. Oder missverstehe ich dich?

      Mathias

      Du hast es richtig verstanden, es sollen ebenfalls die Werte der anderen Felder überprüft werden.

      Aber mit getElementById kann ich doch nur eine Id abfragen?
      Deshalb hab ich das ganze mit getElementByTagName versucht, da alle Felder den selben TagName haben. Klappt aber nicht, warum auch immer?

      Wie kann ich das nun richtig lösen?

      MfG

      cheminar

      1. Du hast es richtig verstanden, es sollen ebenfalls die Werte der anderen Felder überprüft werden.

        Aber mit getElementById kann ich doch nur eine Id abfragen?
        Deshalb hab ich das ganze mit getElementByTagName versucht, da alle Felder den selben TagName haben. Klappt aber nicht, warum auch immer?

        Wie kann ich das nun richtig lösen?

        "richtig" ist Ansichtssache

        moin!

        hängt halt immer davon ab wie flexibel dein code sein soll

        Beispiel:

        ids=new Array("Vorname","Nachname","ort","plz");  
        for(i=0;i<ids.length;i++)  
        {  
         if(document.getElementById(ids[i]) && document.getElementById(ids[i]).value=="") return false;  
        }
        

        hier ist natürlich keine einzeefallentscheidung dabei, sondern nur die Prüfung, ob überhaupt was drin ist. ob der user hier nun bei plz 12345 oder abcde eingegeben hat, spielt hier keine rolle

        ich persönlich definiere zum Beispiel gern in zusätzlichen Attributen gewisse voraussetzeungen

        Beispiel:
        <Input type='text' size=5 maxlength=5 check_min_length=5 check_max_length=5 check_allowed_chars="0-9">

        per object.getAttribute("check_min_length") erhalte ich nun 5 und kann prüfen ob value mindestens 5 zeichen lang ist

        nur als Anregung, andere machen es anders, bleibt alles deiner Entscheidung überlassen ;)

        LG mech

        1. Hallo,

          ich persönlich definiere zum Beispiel gern in zusätzlichen Attributen gewisse voraussetzeungen
          Beispiel:
          <Input type='text' size=5 maxlength=5 check_min_length=5 check_max_length=5 check_allowed_chars="0-9">

          das ist zwar ein pragmatischer Ansatz, damit musst du aber in Kauf nehmen, dass dein HTML invalid ist. In HTML 5 könntest du data-Attribute verwenden, das wäre wenigstens wieder valide.

          Ciao,
           Martin

          --
          Männer haben nur eine Angst: Die Angst, kein Mann zu sein.
            (Liv Tyler, US-Schauspielerin)
          Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
          1. [latex]Mae  govannen![/latex]

            ich persönlich definiere zum Beispiel gern in zusätzlichen Attributen gewisse voraussetzeungen
            Beispiel:
            <Input type='text' size=5 maxlength=5 check_min_length=5 check_max_length=5 check_allowed_chars="0-9">

            das ist zwar ein pragmatischer Ansatz, damit musst du aber in Kauf nehmen, dass dein HTML invalid ist. In HTML 5 könntest du data-Attribute verwenden, das wäre wenigstens wieder valide.

            In HTML5 kann man Informationen zu erlaubten Eingaben (incl. Länge) mit dem pattern-Attribut festlegen.

            Stur lächeln und winken, Männer!

            Kai

            --
            Array(16).join("x" - 1) + " Batman!"
            Wir sind die Schlumpf. Widerschlumpf ist schlumpflos. Wir werden Sie einschlumpfen.
            SelfHTML-Forum-Stylesheet
            1. [latex]Mae  govannen![/latex]

              In HTML5 kann man Informationen zu erlaubten Eingaben (incl. Länge) mit dem pattern-Attribut festlegen.

              ...was zusätzlich den Vorteil hat, daß man diesen Attributwert für Browser, die »pattern« nicht kennen, sehr einfach auslesen und für eine Validierung per Javascript nutzen kann, ohne das RegEx-Pattern dort erneut abzulegen und bei Änderungen an zwei Stellen herumfummeln zu müssen.

              Stur lächeln und winken, Männer!

              Kai

              --
              Array(16).join("x" - 1) + " Batman!"
              „Die Borg würden nicht mal Spaß verstehen, wenn sie einen Vergnügungspark assimiliert hätten!” (B'Elanna Torres)
              SelfHTML-Forum-Stylesheet
  2. @@cheminar:

    nuqneH

    Hier ist mal mein html code(nur im Zusammenhang des JavaScripts):

    Zur Formularvalidierung sollte gar kein JavaScript erforderlich sein. Moderne Browser können das von Haus aus mit HTML5. Wenn nur nicht dieser Drecksbrowser aus dem Hause Apple wäre … http://forum.de.selfhtml.org/archiv/2013/2/t212733/#m1453470 ff., http://alistapart.com/article/forward-thinking-form-validation

    Dennoch würde ich auf HTML5 setzen. Und ein zusätzliches JavaScript, dass nur für Safari und alte IEs geladen(!!) und ausgeführt wird.

    <input type="text" placeholder="Vorname" class="regstyle" name="Vorname" id="Vorname"/>

    Nein. „Vorname“ etc. sollten keine Placeholder sein, sondern Label für die Eingabefelder:

    <label for="Vorname">Vorname</label>  
    <input type="text" class="regstyle" name="Vorname" id="Vorname"/>
    

    Benutzer von Screenreadern können mit Eingabefeldern ohne Label wenig anfangen. Aber auch für Sehende sind Label, die beider Eingabe verschwinden, nicht sinnvoll. http://forum.de.selfhtml.org/archiv/2013/5/t213782/#m1462206

    <div id="msginput">Du musst alle Felder ausgef&uuml;llt haben.</div>

    Du muss nicht alle Umlaute verst&uuml;mmelt haben. http://www.w3.org/International/questions/qa-escapes#not

    Qapla'

    --
    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
    1. Moin,

      HTML5 wäre auch meine erste Wahl. Einziges Manko neben den Browsern die das nicht unterstützen ist natürlich die Darstellung. Das hässliche Rot passt nunmal nicht in jedes Layout. Auch die Fehlermeldung könnte schöner formuliert werden.

      Eine schicke JS Lösung basierend auf JQuery würde ungefähr so aussehen:

      function checkNumber(){ //--- Nummer prüfen }  
      function checkTelefon(){ //--- Telefon prüfen }  
      function checkMail(){ //--- Telefon prüfen }  
        
      $().ready( function() {  
          $("[data-check]").blur( function() {  
              var boolReturn = $(this).attr("data-check")();  
              if( boolReturn !== true )  
              {  
                 showErrorMessage( boolReturn );  //--- Funktion, welche die Error Nachricht anzeigt  
              }  
          });  
      });  
        
      <input data-check="checkNumber" name="Telefon" />  
      <input data-check="checkMail" name="Mail" />
      

      Der Witz ist, dass man im HTML Code quasi die Art der Validierung bestimmt. Somit brauchst du den Javascript Code nicht anfassen, wenn ein neues HTML Element ins Formular kommt.
      Hab ich einfach mal so runter geschrieben, kann auch Fehler enthalten.

      Gruß
      Das gestrige Geburtstagskind
      T-Rex

      1. Hallo,

        Das gestrige Geburtstagskind
        T-Rex

        na dann gratuliere ich nachträglich noch und wünsche alles Gute!
        Oder ist es schon so weit, dass man "herzliches Beileid" wünschen soll? ;-)

        Auch wenn es der 07.07. ist, bist du ja sicher noch nicht 77 geworden. Aber vielleicht 1977 geboren?

        So long,
         Martin

        --
        Wenn man keine Ahnung hat - einfach mal Fresse halten.
          (Dieter Nuhr, deutscher Kabarettist)
        Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
        1. na dann gratuliere ich nachträglich noch und wünsche alles Gute!

          Vielen Dank.

          Oder ist es schon so weit, dass man "herzliches Beileid" wünschen soll? ;-)

          Niemals. Jeder Lebensabschnitt hat seine guten Seiten!
          0 - 10 an Milchflaschen nuckeln
          10 - 20 Party !
          20 - 30 echte Partys !
          30 - 40 frust trinken, da man seine Jugend versoffen hat.
          47 Leberzirrhose !
          Mein Leben ist durchgeplant ;).

          Auch wenn es der 07.07. ist, bist du ja sicher noch nicht 77 geworden. Aber vielleicht 1977 geboren?

          Nein 1983, was mich jetzt zu einem 30 Jährigem macht. Die schöne 2 ist leider weg :(. Dafür kann ich jetzt Chicks auf Ü-30 Parties abchecken :D.

          Gruß
          so short
          T-Rex

          1. Moin,

            Oder ist es schon so weit, dass man "herzliches Beileid" wünschen soll? ;-)
            Niemals. Jeder Lebensabschnitt hat seine guten Seiten!

            das ist auch wieder wahr.

            0 - 10 an Milchflaschen nuckeln
            10 - 20 Party !
            20 - 30 echte Partys !
            30 - 40 frust trinken, da man seine Jugend versoffen hat.
            47 Leberzirrhose !
            Mein Leben ist durchgeplant ;).

            *fg*

            Auch wenn es der 07.07. ist, bist du ja sicher noch nicht 77 geworden. Aber vielleicht 1977 geboren?
            Nein 1983, was mich jetzt zu einem 30 Jährigem macht. Die schöne 2 ist leider weg :(. Dafür kann ich jetzt Chicks auf Ü-30 Parties abchecken :D.

            Ja, und dich innerhalb dieses Kreises ohne moralische Bedenken auf die Jüngsten konzentrieren. Das hat doch auch was. :-)
            Aber wenn ich so zurückdenke - das angenehmste oder schönste Lebensjahrzehnt waren bei mir bisher die 20er, auch wenn jede andere Dekade ebenfalls ihren Reiz hat(te).

            Ciao,
             Martin (44)

            --
            Der geistige Horizont ist der Abstand zwischen Brett und Hirn.
            Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
          2. હેલો

            0 - 10 an Milchflaschen nuckeln

            Sind das Monate? Ansonsten scheint da etwas gewaltig schief gelaufen zu sein ;)

            10 - 20 Party !
            20 - 30 echte Partys !

            FULL ACK!

            30 - 40 frust trinken, da man seine Jugend versoffen hat.

            Nenne es wie du willst, Hauptsache es wird gekippt ;)

            47 Leberzirrhose !
            Mein Leben ist durchgeplant ;).

            Klingt doch nach 'nem vielversprechenden Plan. Hier wünsch ich dir allerdings keinen Erfolg!

            Nein 1983,

            Bin ich ja nah dran mit meinem 80er Baujahr. In meiner Kultur müsstest du mich ab jetzt eigentlich „ağabey“ nennen, aber ist jetzt nicht zwingend oder so. Ist quasi Freiwillig.

            બાય

            --
             .
            ..: