Linking combo box (vorzugsweise JQuery)

Question

Ich Frage mich, ob jemand irgendwelche Erfahrungen mit einem JQuery-plugin, das wandelt html

<select> 
  <option> Blah </option> 
</select>

combo-box in etwas (wahrscheinlich ein div), wo Sie ein Element auswählen Taten das gleiche wie Sie auf einen link klicken.

Ich denke, Sie könnte wahrscheinlich verwenden Sie javascript, um Griff eine Auswahl Veranstaltung (meine javascript-Kenntnisse verfügen, ist ein wenig heruntergekommen aus, der im moment) und 'Schalter' auf den Wert der combo-box, aber das scheint eher ein hack.

Ihre Ratschläge, Erfahrungen und Empfehlungen sind willkommen.

Answer 1

Die einfache Lösung ist die Verwendung

$("#mySelect").change(function() {
  document.location = this.value;
});

Dies erzeugt ein onchange-Ereignis im select-box, die leitet Sie auf die gespeicherte url in das Feld Wert ein der ausgewählten option.

Answer 2

Ich bin mir nicht sicher, wo Sie verknüpfen möchten, wenn Sie auf das Div, aber da so etwas wie dies vielleicht funktionieren würde:

<select id="mySelect">
  <option value="1">Option 1</option>
  <option value="2">Option 2</options>
</select>
<div id="myDiv"/>

und der folgende JQuery erstellt eine Liste der <div> Elemente, die eine geht auf eine URL basierend auf dem Wert der option:

$("#mySelect option").each(function() {
    $("<div>" + $(this).text() + "</div>").appendTo($("#myDiv")).bind("click", $(this).val(), function(event) {
        location.href = "goto.php?id=" + event.data;
    });
});
$("#mySelect").remove();

Nicht das tun, was Sie wollen?

Answer 3

Wenn Sie gehen, um haben eine Menge Felder auswählen, die Sie wollen zu verwenden wie Umleitungen, ohne Sie definieren zu müssen unabhängig voneinander, versuchen, etwas ähnliches wie:

$("[id*='COMMON_NAME']").change(function() {
    document.location = this.value;
});

Und haben Ihre Felder auswählen, werden entsprechend benannt:

<select id="COMMON_NAME_001">...</select>
<select id="COMMON_NAME_002">...</select>

Dies erzeugt ein onchange-Ereignis für alle-IDs mit "COMMON_NAME", um eine Umleitung von der <option> Wert.

Answer 4

Dieses javascript in die 'select':

onchange="if(this.options[this.selectedIndex].value!=''){this.form.submit()}"

Es ist nicht ideal (da Formulars in ASP.NET MVC-was bin ich mit erscheinen nicht verwenden die routing-engine, die für URLs), aber es macht seinen job.