knockout.js with optionsValue和value

有沒有辦法讓value與對象保持綁定，但是optionsValue是對象的屬性。截至目前，如果我指定了兩者，則所選的optionsValue屬性將填充value綁定。 Id喜歡將對象保持在可觀察對象中，但指定要在選擇列表值中設置的值。這樣一個表單提交將發送我選擇的optionsValue。knockout.js with optionsValue和value

@Html.DropDownListFor(q => q.DivisionId, new SelectList(Enumerable.Empty<string>()), new { data_bind="options: divisions, optionsText: 'Name', optionsValue: 'Id', value: division, optionsCaption: ' - '" }) 

function AddCrossPoolGameDialog() { 
    var self = this; 

    self.divisions = ko.observableArray([]); 
    self.division = ko.observable(); 

    self.awayDivisionTeams = ko.computed(function() { 
     var division = ko.utils.arrayFirst(self.divisions(), function(item) { 
      return self.division.Name() == item.Name; 
     }); 

     if (division) { 
      return division.DivisionTeamPools; 
     } 

     return []; 
    }); 
}

來源

2013-06-24 Mike Flynn

這聽起來很簡單，爲這種行爲寫一個綁定。我不知道是否有內置的方式。另一種方法是簡單地爲值和提交使用兩個不同的屬性。另一個問題，如果財產沒有真正觀察改變爲什麼它是一個可觀察的財產？ –

其他一些下拉菜單依賴於它來顯示/隱藏。 –

我真的無法理解你的結構，你會介意在jsfiddle上創建一個非常簡化的問題示例並在此處發佈代碼？ –

你不能同時獲得optionsValue和value綁定指向不同的對象，但你可以創建一個簡單的解決方法。

爲了讓您的表單提交一個簡單的值，請使用optionsValue指向您想用表單發佈的綁定項目的屬性。然後將value綁定分配給observable。最後，創建一個computed以在選定值更改時自動查找並返回正確的對象。

例綁定：

<select data-bind="options: options, 
        optionsText: 'name', 
        optionsValue: 'id', 
        value: selectedOptionId"></select> 
<br/> 
<br/> 
Selection Option Object : <span data-bind="text: selectedOption"></span><br/> 
Selection Option name : <span data-bind="text: selectedOption().name"></span><br/> 
Selection Option id : <span data-bind="text: selectedOption().id"></span><br/>

和視圖模型：

var optionModel = function(id,name){ 
    var self = this; 
    self.id = id; 
    self.name = name; 
} 

var viewModel = function(){ 
    var self = this; 
    self.options = [ 
     new optionModel(1,"First"), 
     new optionModel(2,"Second") 
    ]; 
    self.selectedOptionId = ko.observable(self.options[0].id); 
    self.selectedOption = ko.computed(function(){ 
     return ko.utils.arrayFirst(self.options, function(item){ 
      return item.id === self.selectedOptionId(); 
     }); 
    }); 
} 

ko.applyBindings(new viewModel());

I've posted this to a jsFiddle here。

希望這會有所幫助！

來源

2013-06-25 04:19:13

p.i.t.a這是爲了讓它在全局表單驗證中工作，謝謝！ –

保持KO代碼是一場噩夢，爲什麼過去我沒有使用其他任何東西 - 哦，等待，寶（S）C需要在IE8中運行... – mfeineis

knockout.js with optionsValue和value

回答

相關問題