24

有没有办法保持与对象的value绑定，但要成为optionsValue对象的属性。到目前为止，如果我同时指定两者，optionsValue则选择的属性将填充value绑定。我想在 observable 中保持对象完整，但指定要在选择列表值中设置的值。这样，表单提交将发送optionsValue我选择的内容。

@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 [];
    });
}
4

1 回答 1

27

您不能同时让optionsValue和value绑定指向不同的对象，但您可以创建一个简单的解决方法。

为了让您的表单提交一个简单的值，请使用optionsValue指向您希望与表单一起发布的绑定项目的属性。然后将value绑定分配给可观察对象。最后，创建一个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());

我已将其发布到 jsFiddle here。

希望这可以帮助！

于 2013-06-25T04:19:13.230 回答