从下拉菜单中选择项目

时间:2014-05-07 03:24:11

标签: javascript knockout.js knockout-2.0

在这个fiddle和视图约会选项卡中有一个添加计时按钮。当点击同一个按钮时,会插入一个新行。我在配置文件选项卡中有一个按钮保存并点击它打印控制台上的JSON值。

我的问题

假设我点击了2次添加计时按钮按钮,因此插入了2个新行。现在我从工作日菜单中选择了一天,输入了整个时间,从时间和选定的医院从下拉列表。现在我点击保存按钮(在配置文件选项卡中)我想要JSOn,但在我的情况下,hospitalID仍然是空白的。所以现在我做了变量并为其分配了5,如fiddle

所示

但是现在我不能让hospitalID=5硬编码,因为现在有一家医院但是将来我可以添加更多的医院,所以根据选定的医院从下拉,我想要医院ID

1 个答案:

答案 0 :(得分:2)

hospitals数组需要是一个包含两个键的对象数组,一个用于id,另一个用于医院的名称。

var hospitals = [];
for (var i = 0; i < schedules.length; i++) {
    hospitals.push({ name: schedules[i].hospital(), id: schedules[i].hospitalId() });
}

然后,您可以在optionsText中为下拉列表指定optionsValuedata-bind参数。另外,请务必更改value参数以使用日程表中的hospitalId字段。

<select class="span8" name="hospital"
    data-bind="options: $parent.hospitalOptions,
               value: hospitalId,
               optionsCaption: 'Select Hospital',
               optionsText: 'name',
               optionsValue: 'id'" data-required="true" data-trigger="change">
</select>

每当修改下拉列表时,hospitalId字段现在都在模型中更新,但hospital字段不是。我建议将其转换为计算字段,该字段根据hospitalId值从查找中获取正确的医院名称。

JSFiddle:http://jsfiddle.net/5nZRh/17/