✔ Feldstatusanzeige mit Grafik

[ruNN0r]

hi,
ich will hinter ein Textfeld ein Bild machen das dem Nutzer zeigt ob seine Eingabe gültig ist.
das Script sieht wie folgt aus:

  function checkpic(feld){
    if(document.getElementById(feld) == ""){
      alert('nicht OK');
      document.getElementById("img_"+feld).src='pics/page/bad_status.gif';
    }else{
      alert('OK');
      document.getElementById("img_"+feld).src='pics/page/good_status.gif';
    }
  }


<input type='text' maxlength='50' id='betreff'  name='betreff'><img src='pics/page/bad_status.gif' onClick=\"checkpic('betreff')\" id='img_betreff'>

der Code befindet sich in einer JS datei und wird wie folgt eigebunden:
<script language="JavaScript" src="js/script.js"></script>

Nun habe ich 2 probleme.
1. Wie mache ich es das wenn ich mit dem Curser das Feld verlasse die Funktion ausgeführt wird und somit die Grafik ändert? (momentan zu testzwecken nutze ich im bild onClick)
2. Wenn es ausgeführt wird wird immer nur OK ausgeführt egal ob etwas in dem Feld steht oder nicht!



Danke euch schon mal.

 

[con-f-use]

Okay, erstmal ne kleine Formsache, die eigentlich unwichtig ist, aber trotzdem erwähnt werden sollte. Das language-Attribut in <script>-Tags ist depreciatet (unerwünscht). Benutze besser sowas wie

<script type="text/javascript" src="datei.js">

Nun zu deinem Problem:
Der Event deiner Wahl ist der onblur()-Event.

<input type="text" id="mumpitz" onblur="checkpic(this.id)" />

Und es gibt immer "Ok" aus, weil du einen Fehler in der if-Anweisung gemacht hast. Schau nochmal genau hin oder lies das Kleingedruckte unten:

document.getElementById(feld) gibt dir eine Referenz auf das Feld zurück, nicht seinen Wert. Die Bedingung document.getElementById(feld) == "" ist damit nie erfüllt, weil die Referenz nur dann ein Leerstring ist, wenn das Feld nicht existiert. Du willst den Wert vergleichen, also benuzte das value-Attribut, also if(document.getElementById(feld).value == "").

 

[ruNN0r]

hey super,
danke dir hat alles super funktioniert!