<label> verweist auf einen submit button. IE ignoriert es.

[aradeke]

Guten Morgen zusammen,

ich schreibe gerade eine kleine Umfrage und habe meine Naviagtion über <label>
gelöst:

---
if($_REQUEST["page1"]) {$page = 1;}

<form method="post" action="<?php echo '?Seite='.$page;?>" enctype="text/html" accept-charset="utf-8" name="Form">

<label for="page1" class="<?php if($page == 1) {echo 'anavi';} else {echo 'navi';}?>" style="line-height:40px;text-indent:0em">Einleitung </label>

<input type="submit" name="page1" id="page1" style="visibility:hidden">

switch($page) { case 1: {echo $welcome;break;} }
---

In Worten: Beim Laden wird per PHP überprüft, über welchen Button die Seite aufgerufen wurde. Je nach Button erhält die Seite eine andere Variable, welche wiederum den Text der Umfrage erzeugt.

Das Problem: Der Button soll unsichtbar sein und wird per <label> angesprochen. In Opera und FireFox geht das Problemlos. IE bockt.

Weiß jemand, woran das liegen könnte?

Danke!

[LX]

Formulare im IE sind generell ein Thema - eines, dass voraussichtlich auch im IE9 noch nicht völlig geklärt sein wird. Alle Browser ausser dem IE lösen beim Absenden durch Druck auf die Enter-Taste ein Click-Event auf dem ersten verfügbaren Submit-Button im Formular aus. Viele dieser Probleme lassen sich durch die Verwendung von <button type="submit"> anstelle <input type="submit"> beheben. Vielleicht funktioniert das auch in diesem Fall.

Alternativ kann man mit JavaScript dem <label> im IE ein eigenes onclick-Event mitgeben.

Gruß, LX

[dedlfix]

Hi!

Formulare im IE sind generell ein Thema - eines, dass voraussichtlich auch im IE9 noch nicht völlig geklärt sein wird. Alle Browser ausser dem IE lösen beim Absenden durch Druck auf die Enter-Taste ein Click-Event auf dem ersten verfügbaren Submit-Button im Formular aus.

Laut HTML-4.01-Spezifikation (Form submission) ist dieser Punkt nicht genau geklärt. Man kann es aber so lesen, dass ein nicht gedrückter Button nicht activated wurde, demzufolge nicht successful ist und deshalb nicht übertragen wird. Einfach den nächstbesten zu nehmen sieht mir eher nach einem Fehler aus.

Viele dieser Probleme lassen sich durch die Verwendung von <button type="submit"> anstelle <input type="submit"> beheben.

Damit handelt man sich aber in IEs kleiner 8 erst recht Probleme ein, weil da gleich zwei Fehler enthalten sind. Es wird zum einen nicht das name-value-Pärchen sondern name und der Content übertragen und zum anderen geschieht dies von allen enthaltenen <button type="submit">.

Lo!

[LX]

Hi, dedlfix!

Wie Du schon korrekt anmerkst, ist dieses Verhalten im Standard nicht näher definiert. Beide Verfahren sind also standardkonform. Der gesunde Menschenverstand gibt auf den ersten Blick tatsächlich dem Verhalten des IE den Vorzug. In der Praxis ist das zusätzliche Event aber beispielsweise zum Formular-Tracking enorm praktisch.

Der IE hat im Bezug auf Formulare aber noch weitere Schwächen. Der Hauptgrund besteht darin, dass die Darstellung nicht durch browserinterne, sondern systeminterne Komponenten geschieht, wodurch einerseits das Styling erschwert wird und andererseits Darstellungsprobleme (beispielsweise ein flackernder Cursor beim Refresh der Rendering Engine) hinzukommen. Diese Probleme werden übrigens derzeit beim IE9 angegangen, ich bin noch gespannt, wie das Ergebnis aussieht.

Gruß, LX

[Gunnar Bittersmann]

@@aradeke:

nuqneH

<form method="post" action="<?php echo '?Seite='.$page;?>" enctype="text/html" accept-charset="utf-8" name="Form">
<label for="page1" class="<?php if($page == 1) {echo 'anavi';} else {echo 'navi';}?>" style="line-height:40px;text-indent:0em">Einleitung </label>

Serverseitiger Code ist bei einem clientseitigen Problem völlig irrelevant. Zeige nicht den PHP-Code, sondern den generierten HTML-Code!

Das Problem: Der Button soll unsichtbar sein und wird per <label> angesprochen. In Opera und FireFox geht das Problemlos. IE bockt.
Weiß jemand, woran das liegen könnte?

An "visibility: hidden".

Positioniere ihn außerhalb des Viewports:

#page1  
{  
  left: -666px;  
  position:absolute;  
  width: 0;  
}

Und keine Inline-Style-Angaben!

Qapla'

[aradeke]

Danke an alle!

Habe die Lösung mit dem Auslagern des DIV genommen.

@@ Gunnar:

Serverseitiger Code ist bei einem clientseitigen Problem völlig irrelevant. Zeige nicht den PHP-Code, sondern den generierten HTML-Code!

Werd ich mir merken.

Und keine Inline-Style-Angaben!

Sind nur während der Testphase drin. Kommen in die css-Datei, sobald alles steht.

@@LX

Alternativ kann man mit JavaScript dem <label> im IE ein eigenes onclick-Event mitgeben.

JS möchte ich vermeiden. :-)

Nochmal Danke und die besten Grüße,

Alexander