T-MO: "Vorselektion" eines falschen Button durch IE

Moin moin zusammen,

zur Zeit bin ich dabei, einen Einstieg in Ajax zu finden. Dazu habe ich eine Seite gebaut, die sowohl auf klassische Weise wie auch über das XmlHttpRequest Daten überträgt.

Klassische Requests sollen auf zwei Wege ausgelöst werden können. Zum einen soll bei Drücken der "Enter" Taste in einem Textfeld submittet werden (=> Standartverhalten) und zum anderen habe ich Button vom Typ "Submit".

Einige dieser Button sind per Default deaktiviert. Wenn ich jetzt per Javascript das "disabled" Attribut entferne, wird pauschal der erste, zur Zeit verfügbare Button "vorselektiert" (Der erste im DOM, der auf dem Bildschirm sichtbar ist und nicht disabled).
Er bekommt einen schwarzen Rand, wobei die Ränder rechts und unten dicker erscheinen. (Das Aussehen kann man auch generieren, indem man einen Button drückt und die Maus dann von der Schaltfläche runter bewegt).
Wenn ich jetzt mit "Enter" submitten möchte, gaukelt der IE6 vor, der entsprechende Button wäre gedrückt worden.
Da hinter Button teils komplexe Funktionen liegen, machht der Server folglich Mist...

Dieses Problem betrifft nur den IE. Außerdem ist es egal, bei welcher Komponente das "disabled" Attribut geändert wird. Es kann sich durchaus auch um ein Textfeld oder Ähnliches Handeln, damit das Problem auftritt.

Meine Frage ist jetzt, wie ich verhindern kann, dass ein Button "vorselektiert" werden. Eventhandler wie "onFocus" sprechen nicht an und auch direktes fokussieren eines anderen Buttons führt nicht zum Ziel.

Ein Ansatz von mir war, den Type der Button von "submit" auf "button" zu ändern und ein submit quasi zu Fuß auszulösen. Vorteil: Es werden keine Button mehr submittet, die nicht gedrückt wurden. Nachteil: Submit per "Enter" funktioniert gar nicht mehr, nachdem ein "disabled" Attribut geändert wurde.

Über Hilfe wäre ich sehr dankbar!

Viele Grüße
T-MO

  1. Moinsen

    Wenn ich jetzt per Javascript das "disabled" Attribut entferne

    (...) und gleich danach einem anderen Element einfach den Fokus gebe, sollte es klappen. [ document.getElementById("ichBinEtwasDasRuhigDenFokusErhaltenSoll").focus()]

    Quick'n'Dirty-Gruß,
    DL

    1. Moin,

      erst mal vielen Dank für die Antworten.
      Hab mich jetzt aber doch für die große Umgehung entschieden. Sprich den type submit durch button ersetzt. Alle Submits löse ich jetzt manuell aus, inklusive submit bei "Enter". Is nicht wirklich schön, aber es läuft...

      "Enter" klappt allerdings nur im IE, da FF und Opera Key Events anders behandeln. Da bei den beiden Browsern die Problematik von Anfang an nicht bestanden hat und sie auch jetzt weiterhin mit "Enter" normal submitten, passt das scho...

      Den Focus auf ein anderes Element zu legen geht nicht. Genausowenig ist eine Steuerung über Attribute möglich gewesen. Den Status, welcher Button aktiviert ist, vergibt der IE nach eigenen Regeln (wie von MudGuard beschrieben), auf die der Entwickler nur indirekt (über die Reihnfolge der Button...) Einfluss hat.

      Warum ein Button aber erst aktiviert wird, nachdem man mit Javascript im DOM gespielt hat, bleibt mir ein Rätsel... Is halt mal wieder IE...

      Bis dann
      T-MO

  2. echo $begrüßung;

    Wenn ich jetzt per Javascript das "disabled" Attribut entferne, wird pauschal der erste, zur Zeit verfügbare Button "vorselektiert" (Der erste im DOM, der auf dem Bildschirm sichtbar ist und nicht disabled).

    Es besteht kein Zusammenhang zwischen der Position eines Elements im DOM und seiner Position auf dem Bildschirm. CSS-Formatierung macht es möglich, Elemente beliebig umzusortieren.

    Meine Frage ist jetzt, wie ich verhindern kann, dass ein Button "vorselektiert" werden.

    Die Buttons kennen im Web-Umfeld kein "Default"-Attribut, so wie es die Windows-GUI bereitstellt. Du kannst es also nicht direkt beeinflussen, welcher Button der Default-Button wird.

    Wenn ich jetzt mit "Enter" submitten möchte, gaukelt der IE6 vor, der entsprechende Button wäre gedrückt worden.

    Dieses Verhalten konnte ich beim IE nicht beobachten, wohl aber beim FF. Die HTML-Spezifikation lässt sich im Kapitel Forms nicht eindeutig darüber aus, was mit den Buttons passieren soll, wenn ein Formular per Enter abgesendet wird. Der IE sieht einen nicht gedrückten Button nicht als "successful" an, und sendet kein Name-Value-Pärchen.

    Da hinter Button teils komplexe Funktionen liegen, machht der Server folglich Mist...

    Vielleicht solltest du nicht so sehr auf die Buttons bauen, wenn man zum einen gar keinen braucht, um das Formular abzusenden, und zum anderen du dadurch keine eindeutig auszuführende Aktion bestimmen kannst. Vielleicht wäre eine Auswahl der Aktion per Radio-Button, Select-Element und dergleichen sinnvoller.

    echo "$verabschiedung $name";

    1. Hi,

      Dieses Verhalten konnte ich beim IE nicht beobachten, wohl aber beim FF.

      Seltsam. Ich hab bisher andere Erfahrungen: der Firefox sendet genau den aktivierten Button (also bei "Enter" bei Fokus auf nicht-Submitbutton) keine Submit-Button-Daten mit.
      Der IE dagegen sendet mindestens den (Quelltext-) ersten Submit-Button mit (bei Verwendung von <button type="submit"> immer alle, aber dann nicht die name-value-Pärchen, sondern vollkommen blödsinnig die name-content-Pärchen).

      Opera sendet bei Abschicken per Enter (bei Fokus auf nicht-Submitbutton) den im Quelltext dem fokussierten Element folgenden Submit-Button (zumindest war das vor ca. einem Jahr so).

      Die HTML-Spezifikation lässt sich im Kapitel Forms nicht eindeutig darüber aus, was mit den Buttons passieren soll, wenn ein Formular per Enter abgesendet wird.

      Es ist nur dann nicht eindeutig, wenn es nur einen einzigen submit-Button gibt (wobei es dann ja nicht wirklich eine Rolle spielt).

      Bei mehreren ist es ganz klar geregelt:

      If a form contains more than one submit button, only the activated submit button is successful.

      Da beim Drücken von Enter (bei Fokus auf einem nicht-Submitbutton) kein submitbutton aktiviert wird, ist auch keiner "successful".

      cu,
      Andreas

      --
      Warum nennt sich Andreas hier MudGuard?
      O o ostern ...
      Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
      1. echo $begrüßung;

        Dieses Verhalten konnte ich beim IE nicht beobachten, wohl aber beim FF.

        Seltsam. Ich hab bisher andere Erfahrungen: der Firefox sendet genau den aktivierten Button (also bei "Enter" bei Fokus auf nicht-Submitbutton) keine Submit-Button-Daten mit.
        Der IE dagegen sendet mindestens den (Quelltext-) ersten Submit-Button mit

        Ja, in der Tat ist das seltsam. Ihr scheint andere Browser zu haben als ich. Eben grad noch mal probiert, ist es (bei mir) so, wie in meiner Erinnerung.

        <form action="" method="get">
            <input type="text" name="input" value="value"/>
            <input type="submit" name="submit" value="submit_value"/>
          </form>
          <pre>
          <?php
          print_r($_GET);

        Absenden mit Enter ergibt im IE

        Array
          (
              [input] => value
          )

        und beim FF

        Array
          (
              [input] => value
              [submit] => submit_value
          )

        (bei Verwendung von <button type="submit"> immer alle, aber dann nicht die name-value-Pärchen, sondern vollkommen blödsinnig die name-content-Pärchen).

        Ja, dass der IE6 beim <button> fehlerhaft arbeitet ist ein anderes (bekanntes) Thema.

        Die HTML-Spezifikation lässt sich im Kapitel Forms nicht eindeutig darüber aus, was mit den Buttons passieren soll, wenn ein Formular per Enter abgesendet wird.
        Es ist nur dann nicht eindeutig, wenn es nur einen einzigen submit-Button gibt (wobei es dann ja nicht wirklich eine Rolle spielt).
        Bei mehreren ist es ganz klar geregelt:
        If a form contains more than one submit button, only the activated submit button is successful.

        Das sehe ich nicht als "ganz klar geregelt" an. Dieser Satz regelt nur den Fall, dass einer der Buttons aktiviert wurde. Er regelt aber weder bei einem noch bei mehreren Submit-Buttons das Verhalten wenn keiner aktiviert wurde.

        Da beim Drücken von Enter (bei Fokus auf einem nicht-Submitbutton) kein submitbutton aktiviert wird, ist auch keiner "successful".

        Was den FF (bei mir) nicht davon abhält, einfach irgendeinen (bzw. den ersten den er findet) als aktiviert anzusehen.

        echo "$verabschiedung $name";

        1. Hi,

          If a form contains more than one submit button, only the activated submit button is successful.

          Das sehe ich nicht als "ganz klar geregelt" an. Dieser Satz regelt nur den Fall, dass einer der Buttons aktiviert wurde.

          Nein. Er regelt den Fall, daß mehrere submit-Buttons vorhanden sind.

          Er regelt aber weder bei einem noch bei mehreren Submit-Buttons das Verhalten wenn keiner aktiviert wurde.

          Doch, bei mehereren Submit-Buttons wird das ganz klar durch den zitierten Satz geregelt.
          Falls mehrere vorhanden sind, wird nur der aktivierte übertragen.

          cu,
          Andreas

          --
          Warum nennt sich Andreas hier MudGuard?
          O o ostern ...
          Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.