Farbig unterlegte Textfelder

Toper

Grünschnabel
Hallo ihr Lieben,
ich hoffe wirklich sehr das ich im richtigen Forum dafür gelandet bin, denn falls nicht entschuldigt bitte meine vollkommene Unwissenheit dafür :(

Zu meinem eigentlichen Anliegen...

Ich habe auf diversen Seiten eine Funktion bei Registrierungsformularen gesehen, die ich gerne übernehmen möchte.
Es geht im genauen darum, das direkt bei der Eingabe der erforderlichen Daten, wie z.B. der Benutzername, direkt geprüft wird ob dieser gültig oder ungültig ist.
Ist dieser gültig, wird das Text-Eingabefeld grün gefärbt.
Ist die Eingabe ungültig, ist das Textfeld rot gefärbt.

Ich weiß das man das sowas in der Art via php machen kann, aber dies geschieht nur dann, nachdem die eingabe abgeschickt wurde und danach geprüft wurde.
Wie stelle ich es also an, das schon direkt bei der Eingabe, überprüft und eingefärbt wird? Irgendwie stehe ich gerade vor einem Rätsel :(

Ich hoffe das mir der ein oder andere von Euch helfen kann.

Toper
 
Wie mein Vorredner schon gesagt hatte muss da JavaScript her:
HTML:
<input type="text" name="input" id="input" onkeydown="validate(this);" />

Javascript:
function validate(obj){
  if( obj.value.match(/[a-z0-9]+/) ){
    obj.style.color = '#0f0';
  }
  else{
    obj.style.color = '#f00';
  }
}

Ist jetzt nicht getestet.
 
Ich würde eine Mischung aus Ajax JQuery benutzen (einen Post an ein PHP-Dokument, dass dann Live die Daten der DB abfragt und dann die Daten an die JQuery Funktion zurück gibt, dann einige Abfragen im Javascript / JQuery Teil erledigen und dann einfach if (wert === false){ // Wenn nicht vorhanden } else { // Wenn vorhanden }

// Edit:

Also meine Erklärung ist nur dafür gedacht, wenn du prüfen willst ob der Benutzername oder die E-Mail noch nicht vorhanden ist , um die Zeichen zu überprüfen nehme das Beispiel von timestamp
 
@Sepp

du hast recht, ich hatte überlesen, was er validieren wollte. Den Namen sollte man sinnvollerweise auf dem Server per ajax-Aufruf prüfen, was aber erst dann funktioniert, wenn das Feld den focus verliert, also nicht während des Schreibens [auch während des Schreibens könnte auf dem Server geprüft werden, aber diese Idee sollte man besser nicht weiterverfolgen ;-)].

Ansonsten müsste man beim Aufruf der Seite alle möglichen Namen mitgeben, was wohl i.d.R. nicht ok ist. Datenbank-unabhängige und relative triviale Dinge, wie ein '@' in einer Mail-Addresse, die richtige Schreibweise eines Datums etc. sollte man auf dem Client per javascript prüfen. Es könnten aber auch semantische Validierungen auf dem Client passieren, z.B. zulässige Kombinationen in Auswahllisten oder Beschränkungen auf bestimmte PLZ-Bereiche etc. .

Gruß
Peter
 
Ehm man kann doch per JavaScript eine Ajax Funktion aufrufen, wenn man in das onchange="" Event des Objects (Input Feldes) diese Funktion schreibt oder bin ich da falsch, da könnte man "on the fly" überprüfen
 
Zurück