Question

我正在尝试通过下拉列表更新对象上的预先存在的属性。该解决方案使用knockout和ko.mapping框架来获取其数据。我遇到的问题是选择现有对象已设置的列表中的项目。

例如：如果一个下拉列表包含2个选项，让我们说第一个男性和第二个女性，并且它代表的属性已经设置为女性，我希望下拉列表中选择了女性。但下拉列表默认为列表中的第一项（男性）并将基础对象更新为男性。

我已经打破了上面的一个快速示例，我已经模拟了数据以匹配我正在处理的数据，即使用ko.mapping框架从服务器获取映射的json。

视图模型

var listItems = '[{"id": "1","name": "male"},{"id": "2","name": "female"}]';
var savedRecord = '{"gender": {"id": "2","name": "female"}}';

ViewModel = function () {
    mappedListItems = ko.mapping.fromJSON(listItems);
    mappedSavedRecord = ko.mapping.fromJSON(savedRecord);
}

ko.applyBindings(new ViewModel());

HTML

<select data-bind="options: mappedListItems, 
               optionsText: 'name',                    
               value: mappedSavedRecord.gender"></select>
<p>mappedSavedRecord.gender.name = <span data-bind="text: mappedSavedRecord.gender.name"></span>

的jsfiddle

http://jsfiddle.net/tgriley1/tLHhE/

Answer 1

你没有告诉Knockout在下拉列表中使用哪个字段用于value属性，而且你还没有告诉它保存的记录中的哪个字段用于预先选择一个选项：

<select data-bind="options: mappedListItems, 
                   optionsText: 'name',
                   optionsValue: 'id',                                      
                   value: mappedSavedRecord.gender.id"></select>

在淘汰赛中预先选择下拉列表项

1 个答案: