[英]Removing and modifying items from ko.observableArray
我都忍了我的MVC4代碼片段在這里 。 我想使用“減號”按鈕刪除它所屬的行,然后遍歷數組並將輸入名稱調整為連續的。 我想我需要按順序使用MVC4模型綁定。
我的問題是,如何確定剛剛單擊了哪個按鈕,以及該按鈕屬於數組中的哪個對象? 有什么想法嗎? 我是淘汰賽的新手,所以我什至不確定這是否是最好的方法。
這是我的視圖模型:
function ViewModel() {
this.breeders = ko.observableArray([{
keyName: ko.observable("Breeders[0].Key"),
valueName: ko.observable("Breeders[0].Value"),
canAdd: ko.observable(true),
canRemove: ko.observable(true)
}]);
this.addRow = function () {
var next = this.breeders().length;
this.breeders.push({
keyName: ko.observable("Breeders[" + next.toString() + "].Key"),
valueName: ko.observable("Breeders[" + next.toString() + "].Value"),
canAdd: ko.observable(true),
canRemove: ko.observable(true)
});
};
this.removeRow = function () {
};
}
這是我的標記:
<div class="form-group">
<div id="breedersFormsContainer" data-bind="template: {name: 'breederForm', foreach: breeders}"></div>
</div>
<script type="text/html" id="breederForm">
<div class="col-lg-offset-3">
<span class="col-lg-1 control-label">Reg: </span><span class="col-lg-2"><input data-bind="attr: {name: keyName}" type="text" class="form-control" /></span>
<span class="col-lg-1 control-label">Name: </span><span class="col-lg-6"><input data-bind="attr: {name: valueName}" type="text" class="form-control" /></span>
<button type="button" class="btn btn-default" data-bind="enable: canRemove"><span class="glyphicon glyphicon-minus">-</span></button>
<button type="button" class="btn btn-default" data-bind="enable: canAdd, click: $parent.addRow.bind($parent)"><span class="glyphicon glyphicon-plus">+</span></button>
</div>
</script>
如果已將點擊處理程序綁定到按鈕,則可以執行以下操作
this.removeRow = function (data) {
yourObservableArray.remove(data);
};
數據將是對綁定到當前行的對象的引用
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.