IE Bug: Grafische Submit-Buttons in Formularen

Die Aufgabe:

Sie wollen ein Formular mit einem Grafik-Submit-Button versehen.

Für diese Aufgabe wurde mit HTML 4.0 das Button-Element eingeführt und ein entsprechender Button wird wie folgt dargestellt:

Wie zu erwarten ist, senden die Browser in diesem Fall die Parameter action=post. Der Internet Explorer aber übermittelt nicht den Inhalt des value Attributs, sondern den Inhalt des button Elements, in diesem Fall also

action=!

Braucht man den value von action aber zur Weiterverarbeitung, muss man nun
ein weiteres Feld vom Typ „hidden“ anlegen und dort den Wert setzen:

Alternativ bietet sich folgende Lösung an:

Soweit so gut, doch wenden wir uns nun dem viel schlimmeren Bug des IE (Internet-Explorers zu:

Sie brauchen in ihrem Formular 2 verschiedene grafische Submit-Buttons (z.B. einen für Vorschau, einen zum Absenden) – eine typische Aufgaben-Stellung bei der vollständigen Implementierung eines eigenen Layouts in die Foren-Software phpBB.

An dieser Stelle gehen die Probleme los. Was der Firefox problemlos bewältigt, fördert beim Internet-Explorer einen tollen Bug (engl. Fehler) zu Tage:

Die Buttons sehen zwar gut aus, aber der IE weigert sich hartnäckig, ihnen eine Funktion zu verleihen. Submit-Buttons innerhalb eines Formulars bearbeitet der Internet Explorer schlicht und einfach gar nichts, wenn es sich bei den Submit-Buttons um Grafik-Buttons handelt.

Sie haben jetzt mehrer Optionen:

1. Lösungsweg:

Sie verzichten auf grafische Submit-Buttons und formatieren die Buttons mittels CSS.

2. Lösungsweg:

Mittels eines kleinen Java-Scripts wird der richtige Wert in zwei Feldern vom Typ „hidden“ gesetzt:
Als „Grundzustand“ ist der Wert für „Absenden“ gesetzt, mittels onclick wird der Wert für „Vorschau“ gesetzt und der Wert für „Absenden“ gelöscht.
Diese Lösung hat den Nachteil, daß der Vorschau-Buttons nicht funktioniert, wenn JavaScript nicht aktiviert ist. Die wichtigste Funktion (das Absenden des Formulars) ist aber immer vorhanden:

Mehr zum Thema:

• Button tag in bloody Internet Explorer
• Der Internet Explorer und das button Element