Ich möchte die gleiche Tabelle Dropdown Wert

Question

var songsRef = firebase.database().ref('/KTV-Bar/' + loggeduser + '/Reservations/'); 


songsRef.on('child_added', function (snapshot) { 

    mRetrieveSongs = snapshot.val(); 
    $("#dataTables").append(
    "<tr data-id='" + snapshot.key + "'>" 
     + "<td>" + mRetrieveSongs.playlistkey + "</td>" 
     + "<td>" + mRetrieveSongs.username + "</td>" 
     + "<td>" + mRetrieveSongs.numberofhours + "</td>" 
     + "<td>" + mRetrieveSongs.dates + "</td>" 
     + "<td>" + snapshot.key + "</td>" 
     // +"<td id=room>"+"</td>" 
     + "<td id=room>" + '<select id="selectRoom"></select>' + "</td>" 
     + "<td>" + mRetrieveSongs.capacity + "</td>" 
     + "<td>" + '<input type="button" value="Accept" id = "accept" onclick="writeUserData(this)" ">' 
     + ' <input type="button" value="Decline" id = "decline" onclick="myFunctionDecline(this)" ">' 
     + "<td>" + '<th> </th>">' 
     + "</td>" 
    + "</tr>" 

    ) 

}); 

var roomRef = firebase.database().ref('/KTV-Bar/' + loggeduser + '/Room'); 
roomRef.on('child_added', function (snapshot) { 

    mRetrieveRooms = snapshot.val(); 
    rooms = mRetrieveRooms.room; 


    var select = document.getElementById("selectRoom"); 
    for (var i = 0; i < rooms.length; i++) { 
     var opt = rooms[i]; 
     var el = document.createElement("option"); 
     el.textContent = opt; 
     el.value = opt; 
     select.appendChild(el); 
    } 

}); 

ich in jeder Zeile der Tabelle, die die gleichen Daten meiner Dropdown-Listen haben wollen haben. Ich habe meine Dropdown-Felder aus meinen Firebase-Daten ausgefüllt, aber nur die erste Dropdown-Zeile der Tabelle.

Wie kann ich das lösen?

Answer 1

Angenommen, Sie fügen Optionen dynamisch an. Sie können meinen Code nutzen, um eine Wunschausgabe zu generieren.

var options = ["Make", "America", "Great", "Again"]; 
 

 
var firstDropdown = document.getElementById('first'); 
 
var secondDropdown = document.getElementById('second'); 
 

 
appendOptions(firstDropdown, options); 
 

 
appendOptions(secondDropdown, options); 
 

 
function appendOptions(elem, options) { 
 
    options.forEach(function(value) { 
 
    var option = document.createElement("option"); 
 
    option.text = value; 
 
    elem.appendChild(option); 
 
    }); 
 
}

<select id="first"> 
 
</select> 
 

 
<select id="second"> 
 
</select>