BenjaminB: select options einrücken ohne die Shortcut Tasten zu verlieren

SELF-Forum

select options einrücken ohne die Shortcut Tasten zu verlieren

BenjaminB
– Informationen zu den Bewertungsregeln

Hi selfhtml Foren Benutzer,

ich glaube das ist eine nicht ganz einfache Geschichte, und zwar habe ich ein select-Dropdown mit über 600 Optionen. Diese Optionen stellen Kategorien dar, wobei diese Kategorien nach dem ParentChild Prinzip aufgebaut sind.

Nun versuche ich eine Möglichkeit zu finden, in diesem Dropdown zu verdeutlichen, welche Kategorie eine Unterkategorie von einer anderen Kategorie ist. Da es aber soviele Kategorien sind, will ich aber nicht die Funktionalität verlieren, mittels drücken der Buchstabentasten direkt zu einer Option zu springen, bzw durch drücken von zB "H" mehrmals, alle Optionen durchzuspringen die mit "H" beginnen.

Der meist benutzte Weg ist folgender:

<option>Oberkategorie 1</option>
<option>&nbsp;Unterkategorie 2 von Oberkategorie 1</option>
<option>&nbsp;Unterkategorie 3 von Oberkategorie 1</option>
<option>&nbsp;&nbsp;Unterkategorie 1 von Unterkategorie 3</option>
....
...
..
.

So wird jede Kategorie nach ihrem Level mit &nbsp; eingerückt. Das Problem hierbei ist, das nun diese Shortcut-Funktion mit dem Drücken der Buchstaben für diese Optionen nicht mehr funktioniert, da der Browser nun denkt, die Option startet mit &nbsp; und nicht mehr mit ihrem respektivem ersten Buchstaben. Somit geht mir diese Funktionalität verloren.

Ich habe schon erste Versuche gemacht mit CSS diesen Inhalt einzurücken, doch gelungen ist es mir bis jetzt noch nicht.

Wäre wirklich genial, wenn da jemand eine Idee hätte.
Danke im Voraus
MfG Benjamin

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. select options einrücken ohne die Shortcut Tasten zu verlieren

    BenjaminB
    – Informationen zu den Bewertungsregeln

    Oje, hab jetzt gerade gemerkt, das es einfacher war als ich dachte. Für jede <option> einfach <option style="margin-left:Xpx"> einsetzen, und es funktioniert einwandfrei. Sorry falls jemand sich schon die Zeit genommen hatte, es zu untersuchen.

    Jetzt steht wenigstens im Forum wie es geht, und man kann danach suchen ;)

    MfG Benjamin

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. select options einrücken ohne die Shortcut Tasten zu verlieren

      Gunther Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Hallo Benjamin,

      Oje, hab jetzt gerade gemerkt, das es einfacher war als ich dachte. Für jede <option> einfach <option style="margin-left:Xpx"> einsetzen, und es funktioniert einwandfrei.

      mit entsprechenden CSS Klassen ist es noch "wartungsfreundlicher" (mal ganz abgesehen davon, dass man die Verwendung von Inline-Styles vermeiden sollte)
      Beispiel:

      HTML
      <option class="opt_level_1">
      <option class="opt_level_2">
      ...

      CSS
      .opt_level_1 {margin-left: Xpx;}
      .opt_level_2 {margin-left: Xpx;}
      ...

      Gruß Gunther

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

  2. select options einrücken ohne die Shortcut Tasten zu verlieren

    Maxx Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo Benjamin,

    <option>Oberkategorie 1</option>
    <option>&nbsp;Unterkategorie 2 von Oberkategorie 1</option>
    <option>&nbsp;Unterkategorie 3 von Oberkategorie 1</option>
    <option>&nbsp;&nbsp;Unterkategorie 1 von Unterkategorie 3</option>

    Wie bestimmst du denn normalerweise den Abstand eines Elementes zu seinem Rand? padding vielleicht?

    <option>Oberkategorie 1</option>
    <option style="padding-left:1em;">Unterkategorie 2 von Oberkategorie 1</option>
    <option style="padding-left:1em;">Unterkategorie 3 von Oberkategorie 1</option>
    <option style="padding-left:2em;">Unterkategorie 1 von Unterkategorie 3</option>

    Klappt halt nur mit einem modernen Browser. Selbst der Norweger (zumindest in der Version 7.54) versagt.

    Grüße,

    Jochen

    --
    Heute schon gescribbelt?
    Scribbleboard
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  3. select options einrücken ohne die Shortcut Tasten zu verlieren

    MudGuard Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hi,

    <option>Oberkategorie 1</option>

    optgroup?

    <option>&nbsp;Unterkategorie 2 von Oberkategorie 1</option>
    <option>&nbsp;Unterkategorie 3 von Oberkategorie 1</option>
    <option>&nbsp;&nbsp;Unterkategorie 1 von Unterkategorie 3</option>

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    Schreinerei Waechter
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln