Knockout : Yes/No confirm
HTML
<script type="text/html" id="confirm-template">
Are you sure?
<button data-bind="click: $root.yes">Yes</button>
<button data-bind="click: $root.no">No</button>
</script>
<script type="text/html" id="delete-template">
<span data-bind="text: name, click: $root.delete"></span>
</script>
<div data-bind="foreach: objs">
<div data-bind="template: {name: template, data: $data}"></div>
</div>
JavaScript
var obj = function(data){
this.template = ko.observable('delete-template');
this.name = data;
}
var vm = {
objs: ko.observableArray([new obj('John'), new obj('Jane'), new obj('Pizza')])
}
vm.no: function(item){item.template('delete-template')},
vm.delete: function(item){ item.template('confirm-template')},
vm.yes = function(item){vm.objs.remove(item)},
ko.applyBindings(vm)