Werte in mehreren Auswahlfeld verschwinden, wenn ausgewählt

Question

So habe ich eine 2 mehrere Auswahlbox (eine für den Boden und eine für den Raum). Die Werte im Raum hängen vom Boden ab. Wenn Sie Floor: 001 wählen, beginnen alle Werte im Raum auf 1 und wenn Sie Floor: 002 wählen, beginnen alle Werte im Room in 2 und so weiter. Aber wenn ich die Werte im Zimmer alle Werte wählen verschwinden, hier ist mein Skript:

<script type="text/javascript"> 
$(document).ready(

     function() 
     { 
       var selectArr = []; 
       $("select").change(function(){ 
        var arr = $(this).val() 
        selectArr.push(arr); 
        console.log(arr) 
        populateRooms(); 
        clearArray(); 
       }); 


       function clearArray() { 
        return selectArr = [] 
       }  

     function populateRooms() { 
     $.ajax({ 

       type: "GET", 
       url: "/hms/shifts/" + selectArr, 
       success: function (response) { 
       $('#_rooms_id').empty(); 
        var myObject = eval('(' + response + ')'); 
        for (i in myObject) 
        { 
         $('#_rooms_id').append(
           $('<option></option>', 
           { 
            value: myObject[i]["id"], 
            text: myObject[i]["roomNumber"] 
           } 
           ) 
          ); 
        } 

       }, 
       error: function (e){ 
        alert("Error" + e) 
       } 
      }); 
     } 

     }); 

    </script> 

Ich denke, es ist wegen der .empty() aber wenn ich entfernen, dass alle Werte im Raum zeigen, wird es sei kein Filter. Ich hoffe, dass mir jemand helfen kann. Neuling hier. Vielen Dank.

Answer 1

Ich denke, Sie das Ereignis

die onChange Ereignis an alle Dropdown-Listen in Ihrem Code zu füllen Zimmer-select nur im Boden-select diesen Code hinzufügen sollte hinzufügen:

$("select").change(function(){ 
       var arr = $(this).val() 
       selectArr.push(arr); 
       console.log(arr) 
       populateRooms(); 
       clearArray(); 
      }); 

Änderung dieser:

Answer 2

Sie haben das generische Ereignis 'change' auf alle angewendet, was bewirkt, dass es gelöscht wird.

//you have issue here , $(select) means all selects in your current DOM!  

$("select").change(function(){ 
       var arr = $(this).val() 
       selectArr.push(arr); 
       console.log(arr) 
       populateRooms(); 
       clearArray(); 
      }); 

Chang,

// Apply change on specific instead 
$("select#floorId").change(function(){ 
       var arr = $(this).val() 
       selectArr.push(arr); 
       console.log(arr) 
       populateRooms(); 
       clearArray(); 
      });