onchange値を取得してクエリを実行し、同じページに結果を表示する

Question

みんな私はそれを行う方法はわかっていますが、それを行う方法がわかっていないという問題があります。どんな助けでも大歓迎です。

CODE：

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

BLGD1上のユーザーのクリックは、システムがBLDG1のすべての部屋を取得するクエリを実行し、選択入力にクエリが表示されます一度あまりに

ユーザーならば結果は次のようになります。 BLDG1をクリックする

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

ユーザがBLDG2をクリックすると、すべての部屋がROOMに表示されます。 質問：建物番号を選択/変更した後の結果照会の照会方法 その他の情報：Codeigniter HMVC; JQUERY

ありがとうございます。

Answer 1

あなたはonchange eventを探しています。ここでは良いjQueryのフリーソリューションです：

// 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]; 
    }); 
} 

がJSFiddleでそれをチェックアウト。