Reputation: 3
I am able to create a dynamic form with the help of this link
var viewModel = {
users : ko.observableArray(),
addUser : function () {
this.users.push({
name : ko.observable(),
choicestring : ko.observable()
});
}
};
viewModel.addUser();
ko.applyBindings(viewModel);
my problem is I don't know how to remove the control I have added, how would I do that using the Knockout.js
Thanks and best regards
Upvotes: 0
Views: 171
Reputation: 2266
Knockout's observable arrays have a .remove(item)
function that does this for you. So you could add this to your view model:
removeUser : function ( user ) {
this.users.remove( user );
}
And then wire it up like this:
<ul data-bind="foreach: users">
<li>
<span data-bind="text: name"></span>
(<a href="#" data-bind="click: function () { $parent.removeUser( $data ); }">Remove</a>)
</li>
</ul>
<button data-bind="click: addUser">Add user</button>
Jsfiddle example: http://jsfiddle.net/8zR5u/
Upvotes: 1
Reputation: 3238
Usually it's something like that (valid for webapi so for MVC as well):
self.remove = function (product) {
// First remove from the server, then from the view-model.
$.ajax({ type: "DELETE", url: baseUri + '/' + product.Id })
.done(function () { self.products.remove(product); });
}
Upvotes: 0