Onchange wählen Sie erhalten Wert und tun Abfrage und dann Ergebnis auf der gleichen Seite anzeigen

Question

Jungs Ich habe ein Problem, das ich weiß, dass es möglich ist, aber nicht sicher, wie es geht. Jede Hilfe wird sehr geschätzt.

Code:

<select id='bldg'> 
    <option value='1'>BLDG1</option> 
    <option value='2'>BLDG2</option> 
</select> 

sobald der Benutzer klicken Sie auf BLGD1 das System eine Anfrage gegeben wird, alle Zimmer bldg1 und zeigt die Abfrage auf einem Auswahleingang zu

Ergebnis sieht wie folgt aus, wenn der Benutzer ausführen Klicken Sie auf BLDG1

<select id='room'> 
    <option value='101'>Room 101 - BLDG1</option> 
    <option value='102'>Room 102 - BLDG1</option> 
</select> 

und wenn der Benutzer auf BLDG2 klickt, werden alle Räume in ROOM angezeigt. Frage: Wie wird die Ergebnisabfrage angezeigt, nachdem Benutzer eine Gebäudenummer von gewählt haben? Weitere Informationen: Codeigniter HMVC; JQUERY

Vielen Dank im Voraus.

Answer 1

Sie suchen nach dem onchange event. Hier ist eine gute jQuery-freie Lösung:

// Grab the element 
var sel = document.querySelector('#bldg'); 
// Store updated values 
var updatedVals = [ "Room 101 - BLDG1", "Room 102 - BLDG2" ]; 

// Sets an onchange event function 
// Alternative: sel.addEventListener('onchange', fn() { ... }) 
sel.onchange = function() { 
    // this.children returns a DOMNodeList, calling slice converts it to a proper array 
    var options = Array.prototype.slice.call(this.children, 0); 
    // Map/Loop over the array 
    options.map(function(option, i){ 
    // Change innerHTML of each option to the corresponding updated value 
    option.innerHTML = updatedVals[i]; 
    }); 
} 

Check it out auf JSFiddle.