DropDown-Box-Navigation mit PHP und JavaScript

• DropDown-Box-Navigation mit JavaScript: Reagiert rasch, funktioniert aber nicht immer.
• DropDown-Box-Navigation mit CGI/Perl: Funktioniert immer, aber träge.
• DropDown-Box-Navigation mit PHP: Funktioniert immer und ist zwar einfacher, als die Perl-Version, aber ebenso träge.

Hier finden Sie nun die optimale Implementierung, die das beste aus beiden Welten realisiert: Funktioniert immer und reagiert möglichst rasch.

• Das Layout
• Das Programm
• Analyse

Das Layout

Hier bleibt es bei der PHP-Version. Wir haben ein Formular mit einer DropDown-Box. Die Optionen dieser DropDown-Box sind mit den Zielen beschriftet, ihre Werte sind die Zieladressen.

Zusätzlich jedoch integrieren wir die JavaScript-Version: Wir übernehmen die dortige onchange-Funktion in den select-Tag:

<form action="URL des programms" method="post">
  <select name="goto"
    onChange="location.href=this.options[this.selectedIndex].value">
    <option value="https://brauchbar.de/index.html">Bitte w&auml;hlen</option>
    <option value="https://brauchbar.de/index.html">Homepage</option>
    <option value="https://brauchbar.de/wd/index.html">Newsletter</option>
    <option value="https://brauchbar.de/wd/online/index.html">- Archiv</option>
  </select>

  <input type="submit" value="go" />
</form>

Das genügt nach wie vor zur Demonstration.

Natürlich muss nun als action das Programm eingetragen werden, welches die Formulardaten verarbeiten wird. Als Method sollte post verwendet werden, damit die Werte nicht in der Adresszeile erscheinen.

Das Programm

Das Programm ist die PHP-Version aus dem vorhergehenden Artikel. Natürlich könnten Sie auch die Perl-Version oder eine andere Sprache nutzen:

<?php

if (isset($_POST['go'])) {
  header('Location: '.$_POST['go']);
} else {
  header('Location: '.$_SERVER['HTTP_REFERER']);
}

// --- eof

Das war es schon. Wir haben eine hybride Version.

Analyse

Vorteil

Funktioniert immer, da unabhängig vom Client der Besucher. Insbesondere auch, wenn kein JavaScript nicht genutzt wird.

Wenn der Besucher JavaScript aktiviert hat, wird direkt nach Auswahl rasch reagiert und ohne Server-Kontakt weitergeleitet.

Nachteil

Keiner.