RedHotScalability RedHotScalability - 4 months ago 18
HTML Question

Remove specific element from array in Knockout.JS

I am creating a multiplayer game over network so I have to react on network events.

I have this simple code, but the removePlayer method doesnt work. The addPlayer() works fine.

<table id="userlist2" class="tablesorter" cellspacing="0">
<thead>
<tr>
<th>Name</th>
<th>Queue</th>
<th>Points</th>
</tr>
</thead>
<tbody data-bind="foreach: players">
<tr>
<td data-bind="text: name"></td>
<td data-bind="text: queue"></td>
<td data-bind="text: score"></td>
</tr>
</tbody>
</table>


function PlayerViewModel() {
var self = this;
self.players = ko.observableArray();

self.addPlayer = function (Name, QueuePos, Score) {
self.players.push({
name: Name,
queue: QueuePos,
score: Score
});
}


self.removePlayer = function (Name) {
for (var i = 0; i < self.players().length; i++) {

if (self.players()[i].name == Name) console.log(i);
self.players().splice(i, 1);
}
}
}


players = new PlayerViewModel();
ko.applyBindings(players);

players.addPlayer('Player1', '0', '0');
players.addPlayer('Player2', '0', '0');
players.removePlayer('Player2');


Heres the http://jsfiddle.net/xseTc/

Answer

You have to use the remove function :

self.removePlayer = function (Name) {
    self.players.remove(function(player) {
        return player.name == Name;
    });

}

See fiddle

Comments