✔ select Tag mit Links füllen

[son gohan]

Hallo,

ich hab da so ein select Tag mit ein paar Links gefüllt, aber ich weis nicht wieso die Links nicht aufgerufen werden, wenn ich die Einträge auswähle?

Code:

<select name="select">
<option value="#">Kategorien</option>
<option value="http://www./ao.html">hhh</option>
<option value="http://www./buy.html">hhh</option>
</select>

normalerwesie müsten sich doch die Seiten laden oder wie mach man das? Bei SELFHTML habe ich irgendwie nicht gescheites für diese einfach Frage gefunden.

 

[hpvw]

Um Links in einem Select-Feld aufzurufen benötigst Du JavaScript oder eine serverseitige Programmiersprache wie PHP, welche die Auswahl auswertet und zu der entsprechenden Seite weiterleitet.

 

[son gohan]

Hallo,

welche der beiden Varianten würdest du mir empfehlen. Wenn ich die mit Javascript nehmen würde, dann wäre nicht sicher das es bei jedem funktioniert ne?

Und bei PHP ist die Frage wie aufwendig es wäre. Ich denke selber das PHP da die besser Lösung wäre weil es überall gehen müste?

Hast du Tipps wo ich das ganze einfach erklärt finde?

Für Javascript habe ich bereits hier bei tutorials eine Lösung bekommen, wie ich ein Link in ein Iframe öffnen kann:

Code:

  onChange="document.getElementById('main').src=this.value"

main ist da der Name vom Iframe und das ganze kommt in das select Tag.

 

[hpvw]

In PHP:

<? 
if (isset($_GET['select'])) {
    header("Location: ".$_GET['select']);
}
?>

Siehe auch [phpf]header[/phpf].
Das Formular musst Du entweder mit JavaScript (onchange) abschicken oder (zusätzlich für User ohne JavaScript) einen Submitbutton einbauen.

 

[son gohan]

Hallo,

die PHP Technik kann ich nicht. Aber zu der Javascript Lösung habe ich noch eine Frage. Ich habe ja do oben ein Beispiel gezeigt mit Javascript welches die URL im Iframe main ladet.

Jetzt woll ich mal wissen wie man das schreiben muss damit sich die URL im gleichen Fenster komplett öffnet?

 

[son gohan]

Hallo hpvw,

habe eben eine Lösung gefunden wie sich der Link gleichen kompletten FEnster öffnet. DAzu muss man nur den folgenden Code ins select Tag tun:

 onChange="self.location.href=this.value"

Nun habe ich mich auch dazu entschieden diese Variante zu nehmen, auch wenn man dazu Javascript brauch, weil in dem Beispiel von dir hast du ja geschrieben das man auch ein submit Button mit Javscript brauch um es mit PHP zu machen oder so.

Ich habe auch leider keine Ahnung von PHP, wenn du mir aber ein einfache Beispiel geben kannst mit PHP dann nehme ich das gerne.

gruß
feh

 

[hpvw]

Naja, Du benötigst JavScript, um das Formular ohne Button ab zu schicken. der Submit-Button ist dazu da, auch Usern ohne JavaScript die Navigation zu ermöglichen.
Den PHP-Code habe ich Dir bereits gezeigt. Dazu benötigst Du ein Formular mit Deinem Select und einem Submit-Button. In dem On-Change-Event schicktst Du das Formular mit der JavaScript-Funktion submit() ab. Den Submit-Button kannst Du mit JavaScript am Ende der Seite ausblenden, so dass er für User mit JavaScript nicht zu sehen ist und User ohne JavaScript die Seite trotzdem benutzen können, da sie mangels JavaScript den Button nicht ausgeblendet bekommen. Die Technik zum Ausblenden ist dieselbe, wie beim Klappmenü, nach welchem Du im JavaScript- und im HTML-Forum suchen kannst.

Gruß hpvw

 

[son gohan]

Hallo,

mein derzeitges select Tag menü sieht so aus:

<select class="combobox" name="select" onChange="document.getElementById('main').src=this.value">
<option value="#">auswahl</option>
<option value="http://www.home.de" >home</option>
<option value="http://www.home.de" >home</option>
<option value="http://www.home.de" >home</option>
</select>

Ist doch so korrekt geschrieben, oder? Denn irgendwie habe ich niergendwo eine venünftige Anweisung gefunden wo steht ob man das ganze in einem FormTag schreiben muss oder nicht.

Wenn ich die von dir empfohelne Technik einbaue mit Submit button für Leute ohne Javascript, dann müste das ganze doch so aussehen?

<? 
if (isset($_GET['select'])) { 
	header("Location: ".$_GET['select']); 

<select class="combobox" name="select" onChange="document.getElementById('main').src=this.value">
<option value="#">auswahl</option>
<option value="http://www.home.de" >home</option>
<option value="http://www.home.de" >home</option>
<option value="http://www.home.de" >home</option>
</select>
 
} 
?>

Ich habe keien Ahnung von PHP und weis auch nicht wie und ob ich den Teil richtig eingebaut habe, bei PHP.net konnte ich auch mal wieder nicht nachvollziehen. Ich muss halt noch ein wenig wartewn bevor ich anfange PHP zu lernen.


Ich will auch ruhig haben, wenn schon überhaupt, dass das submit buton bei beiden VArianten, ohne und mit Javascript zu sehen ist und funktionieren tut. ist der Code den dann so richtig?

gruß
feh

 

[hpvw]

Du benötigst ein Formular, wenn Du die Daten abschicken willst, z.B. an ein PHP-Skript.
Erstaunlicherweise ist ein Select, welches ohne Formular dasteht, valide. Zumindest meckert der Validator bei XHTML 1.1 nicht.

Was ich beschrieben habe kannst Du wie folgt realisieren:

Im html-code (Alles im Body an der Stelle, wo Du Deine Liste stehen haben willst):

<form id="linkliste" method="get" action="linkweiterleitung.php">
<div>
<select class="combobox" name="select" onchange="document.getElementById('linkliste').submit();">
<option value="#">auswahl</option>
<option value="http://www.home.de" >home</option>
<option value="http://www.home.de" >home</option>
<option value="http://www.home.de" >home</option>
</select>
<input type="submit" name="follow" id="followLinkButton" value="Link folgen" />
</div>
</form>

<script type="text/javascript">
<!--
document.getElementById('followLinkButton').style.display="none";
-->
</script>

linkweiterleitung.php:

<? 
if (isset($_GET['select'])) { 
	header("Location: ".$_GET['select']); 
}
?>

Du musst allerdings absolute Links angeben, also nur Links, die mit "http://" beginnen.

Links: JavaScript: Formulare, JavaScript: Style, JavaScript: getElementById, HTML: Formulare definieren, HTML: Auswahllisten, PHP: Vordefinierte Variablen, PHP: header, W3C: Validator

Gruß hpvw

 

[son gohan]

Hallo,

vielen Dank für die Links und das Beispiel. Alsi ich bin ja hobby Webdesigner und tut mich echt schwer wa neue zu lesen.

Ich habe dein Beispiel eben mal auspribiert auch auf mein Server geladen, aber irgendwie fehlt da das submit button, es kommt keins zu Vorschein?

Woran liegt das? Und muss man eigentlich am Ende einés input Tags immer ein / voer der > Klammer schreiben?