ursus contionabundo: Dropdown umsetzten

Beitrag lesen

nicht alles muss sich immer per Tastatur bedienbar sein?

Im konkreten Fall wäre das aber leicht zu bewerkstelligen.

Vor allem wenn es sich nur um ein Backend handelt.

Wenn es nur für Dich ist - ok.

Das Prinzip des gezeigten ist, dass es einmal Elemente gibt, die man anklicken kann:

<button id="btn_prices" onclick="show_form('prices')">Preis</button>
<button id="btn_colors" onclick="show_form('colors')">Farben</button>
<button id="btn_close_all" onclick="show_form(false)">Alle schließen</button>

die lösen onclick ein Javascriptlein aus, welches ein bisher ausgeblendetes Formular einblendet (und ggf. andere ausblendet: )

Exemplarisch:

<form id="prices" style="display:none">
  # …
</form>
<form id="colors" style="display:none">
  # …
</form>

Der Rest ist grafischer Schnickschnack mit Positionierungs- und Rahmen- Tohuwabohu. Das Javascript könnte, in der Geschmacksrichtung "Vanilla", etwa so aussehen:

function show_form( id ) {
  var allForms = ['colors', 'prices'];
  //collectData( allForms );
  while ( f = allForms.shift() ) {
      oF = document.getElemementById( f );
      if ( 'block' == oF.style.display ) {
         //collectData( f );
      }
      if ( f == id ) {
          oF.style.display='block';
      } else {
          oF.style.display='none';
      }
  }
}

function collectDatafromForms( arForms ) {
  while ( f = arForms.shift() ) {
     oF = document.getElemementById( f );
     // work for me
  }
}

Das gänge freilich auch über Klassen.

Die Selektionen und das aktuell sichtbare Formular kann man jetzt in einer Session oder in einem Cookie speichern und und man sollte einen Plan haben, ob man beim Wechsel der Sichtbarkeit der Formulare ggf. einen submit() des bisher sichtbaren Teil-Formulars auslöst und was collectData() wohl erledigen sollte - und ob man das nicht doch besser hinbekommt als die von Dir gezeigte Seite, die, wie Gunnar schon "sagt", es aber nur an dem einem Punkt festmacht, "bei weitem nicht ideal"(¹) ist. Buttons, sogar Links z.B. wären mit der Tastatur bedienbar. Der Rest ist CSS.


¹) Manche nennen sowas mit einiger Berechtigung "Mist".