Fortschrittsbalken in einem Formular

[Abbadon]

Hi @ all,
ich hab folgendes Problem:
ich will ein Formular schreiben, bei dem ganz unten ein Fortschritsbalken ist. Wenn der Benutzer ein Feld ausfüllt soll sich der Balken füllen, so dass wenn alle Felder ausgefüllt wurden er vollkommen ausgefüllt ist. Ich habe schon versucht das ganze mit javascript zu machen, funst aber nicht wie ichs gemacht haben:

<script type="text/javascript">
if(document.getElementByName("name") != "") {
  document.getElementByName("fortschritt").style.width = "25%";
}
</script>

<FORM method="post" action="...">
 <input type="text" name="name">NAME<br>
<DIV style="height:20px;width:170px; background-color:#000000;"><INPUT type="text" readonly name="fortschritt" style="height:20px;width:0%; background-color:green;"></DIV></DIV>
</FORM>

Also was ist daran falsch?
und ist folgende schreibweise möglich:
document.getElementByName("fortschritt").style.width += "25%";

[floater]

Hallo,

was genau "funzt" denn nicht?

Gruß,
Floater

[Der Martin]

Hallo,

<script type="text/javascript">
if(document.getElementByName("name") != "") {
  document.getElementByName("fortschritt").style.width = "25%";
}
</script>

wann wird dieses Script ausgeführt? So wie es geschrieben ist, wohl nur ein einziges Mal beim Laden der Seite. Übrigens verwendest du die Methode getElementsByName() falsch: Das 's' im Methodennamen ist durchaus Absicht, denn es kann ja mehrere Elemente mit dem gleichen Namen im Dokument geben, und getElementsByName() gibt ein Array zurück, das sie alle enthält. Eventuell besteht dieses Array dann nur aus einem einzigen Eintrag. Richtig wäre hier also die Notation getElementsByName("name")[0], und für den obigen Code wirst du mit einer Javascript-Fehlermeldung belohnt, die du anscheinend gar nicht beachtest.

<FORM method="post" action="...">
<input type="text" name="name">NAME<br>
<DIV style="height:20px;width:170px; background-color:#000000;"><INPUT type="text" readonly name="fortschritt" style="height:20px;width:0%; background-color:green;"></DIV></DIV>
</FORM>

Wozu dient das input-Element mit dem Namen "fortschritt"? Es hat keine eigene Funktion; ebensogut könnte das div-Element wachsen (und es müsste nicht einmal einen Inhalt haben). Warum schließt du das div eigentlich zweimal?

und ist folgende schreibweise möglich:
document.getElementByName("fortschritt").style.width += "25%";

Ja, aber nach dem dritten Aufruf (beispielsweise) wäre dann style.width = "25%25%25%", was keinen Sinn ergibt.

So long,
 Martin

[Abbadon]

ich hatte das Script am anfang stehen...
Thx für die Antwort. Also der Fortschritt-balken soll sich pro angabe um 12,5% füllen(sind 8fragen)