IE Bug: Grafische Submit-Buttons in Formularen

Tags: | |

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=Absenden!

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:

Eigene Grafik-Submit-Buttons in einem Formular

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:

Ein Kommentar zu “IE Bug: Grafische Submit-Buttons in Formularen”

  1. aggi meint:

    danke, wusst ich vorher nich. jetzt funzt mein formular auch im iE

Hinterlassen Sie einen Kommentar

Text-Formatierung: Sie können diese XHTML-Tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> benutzen.