zurück zur Startseite
  


Zurück XHTMLforum > Webentwicklung (außer XHTML und CSS) > Javascript & Ajax
Seite neu laden jquery Formular eingaben prüfung hilfe

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 22.04.2014, 20:56
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 30.11.2012
Beiträge: 8
beamwe befindet sich auf einem aufstrebenden Ast
Blinzeln jquery Formular eingaben prüfung hilfe

Hallo Zusammen

Ich habe folgendes problem wo ich nicht weiter komme...


Ich habe erfolgreich ein Formular erststellt, jquery ist für die eingabenprüfung zuständig. Funktioniert auch alles prima.

Mein problem ist wenn eine eingabe gemacht werden dann wird weiterhin ein fehler angezeigt, obwohl berreits etwas eingegeben wurde. Erst wenn ich man auf senden klickt und ein anderer berreich leer ist, verschwindet der Fehler und eine neuer im neuen input feld wird angezeigt. Würde das gerne so haben das wenn gerade etwas eingegeben wird der fehler sofort weg geht, ohne das man auf absenden.

hier der code


HTML-Code:
<div id="contact_form">
            <form name="contact" action="php/contact.php" method="POST" enctype="text/html">
                  <div class="field1" style="padding-top:0;">
                <label for="name" id="name_label">Name:</label>
                <input type="text" name="name" id="name" size="20" value="" class="text-input" />
                <label class="error" for="name" id="name_error">Fehler * Bitte Name eingeben</label>
              </div>
                  <div class="field1"  style="padding-top:0;">
                <label for="nachname" id="nachname_label">Nachname:</label>
                <input type="text" name="nachname" id="nachname" size="20" value="" class="text-input" />
                <label class="error" for="nachname" id="nachname_error">Fehler * Bitte Name eingeben</label>
              </div>
                  <div style="clear:both;"></div>
                  <div class="field1">
                <label for="ort" id="ort_label">Wohnort:</label>
                <input type="text" name="ort" id="ort" size="20" value="" class="text-input" />
                <label class="error" for="ort" id="ort_error">Fehler * Bitte Wohnort eingeben</label>
              </div>
                  <div class="field1">
                <label for="phone" id="phone_label">Telefon:</label>
                <input type="text" name="phone" id="phone" size="17" value="" class="text-input" onkeypress="this.value=keepDigits( this.value );" onchange="this.value=keepDigits( this.value );" />
                <label class="error" for="phone" id="phone_error">Fehler * Bitte Telefon eingeben</label>
              </div>
                  <div class="field1">
                <label for="email" id="email_label">Email:</label>
                <input type="text" name="email" id="email" size="25" value="" class="text-input" />
                <label class="error" for="email" id="email_error">Fehler * Bitte E-Mail eingeben</label>
              </div>
                  <div class="field1">
                <label for="betnachricht" id="betnachricht_label">Betreff:</label>
                <select name="betnachricht" id="betnachricht" class="select-input" size="0" >
                      <option>Option 1</option>
                      <option>Option 2</option>
                      <option>Option 3</option>
                      <option>Option 4</option>
                      <option>Option 5</option>
                      <option>Option 6</option>
                      <option>Option 6</option>
                    </select>
                <label class="error" for="betnachricht" id="betnachricht_error">Fehler * Bitte Betreff eingeben</label>
              </div>
                  <div class="field2">
                <label for="nachricht" id="nachricht_label">Nachricht:</label>
                <div style="clear:both;"></div>
                <textarea name="nachricht" id="nachricht" class="textarea" cols="71" rows="7" ></textarea>
                <label class="error" for="nachricht" id="nachricht_error">Fehler * Bitte Nachricht eingeben</label>
              </div>
                  <div id="send-container">
                <div id="top-info">
                      <p>Ihre Daten werden 'ausschließlich' benutzt, um mit Ihnen Kontakt aufzunehmen Vielen Dank!.</p>
                    </div>
                <div class="sendbutton">
                      <input type="submit" name="submit" class="button" id="submit_btn" value="Absenden" />
                    </div>
              </div>
                </form>
          </div>

Code:
// jquery Document


$(function() {
  $('.error').hide();
  $(".button").click(function() {
    // validate and process form here
     
    $('.error').hide();
    var name = $("input#name").val();
      if (name == "") {
      $("label#name_error").show();
      $("input#name").focus();
      return false;
	}
	var nachname = $("input#nachname").val();
      if (nachname == "") {
      $("label#nachname_error").show();
      $("input#nachname").focus();
      return false;
    }
		var ort = $("input#ort").val();
      if (ort == "") {
      $("label#ort_error").show();
      $("input#ort").focus();
      return false;
    }
	     var phone = $("input#phone").val();
      if (phone == "") {
      $("label#phone_error").show();
      $("input#phone").focus();
      return false;
    }
      var email = $("input#email").val();
      if (email == "") {
      $("label#email_error").show();
      $("input#email").focus();
      return false;
    }
		 var nachricht = $("textarea#nachricht").val();
      if (nachricht == "") {
      $("label#nachricht_error").show();
      $("textarea#nachricht").focus();
      return false;
    }
 
  });
});


Hoffe ihr könnt mir helfen und versteht mein problem.

Danke
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 22.04.2014, 21:31
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

Wenn du mit jQuery sowieso nur prüfst ob das Feld ausgefüllt ist, dann kannst du jQuery auch gleich sein lassen. Mit HTML5 wurde das Attribut required eingeführt, das genau das macht.

Siehe auch Spektakuläre Formulare mit HTML5 - HTML5 Rocks

Deine Eingabefelder lassen nur 20 Zeichen zu, das ist oft zu kurz. Garmischpatenkirchen hat schon 21 Zeichen und viele Nachnamen sind auch oft länger.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 22.04.2014, 22:16
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 30.11.2012
Beiträge: 8
beamwe befindet sich auf einem aufstrebenden Ast
Standard hmm

hmm... also ich habe mich noch nicht in HTML5 eingearbeitet.

Jquery muss erstmal reichen....

es gibt aufjedenfall eine lösing dazu.

Bin nur nicht der fachman für sowas, leider.

MfG
Mit Zitat antworten
  #4 (permalink)  
Alt 22.04.2014, 23:49
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

Die Lösung habe ich dir bereits genannt und funktioniert auch wenn jemand Javascript ausgeschaltet hat, was bei dir nicht der Fall wäre.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.
Mit Zitat antworten
Antwort

Stichwörter
formular, jquery

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Jquery Formular entfernen/verhindern/Attr löschen tichy Javascript & Ajax 1 16.03.2013 20:29
jQuery Hilfe panamera Javascript & Ajax 0 20.02.2010 01:20
JQUERY - Nach Formular senden weitere Funktion aufrufen sturmi2 Javascript & Ajax 1 28.10.2009 17:32
Hilfe für Formular / auf Dankeseite Dee (X)HTML 0 01.12.2007 19:45
Hilfe bei legend formular berndw CSS 2 25.07.2006 13:37


Alle Zeitangaben in WEZ +2. Es ist jetzt 04:52 Uhr.