UI 淘汰 js 中的下拉列表选定值未更新

Question

In my application, I am having a table and when selected a row it shows its details (with more options in addition to the data in the table).

单击编辑按钮时，它会显示可编辑页面，我可以在其中在测试框和下拉列表中进行编辑。

在这里，当我在文本框中编辑值时，该值在 UI 中以不可编辑的形式更新。

但是当我更改下拉列表时，更新的值不会以不可编辑的形式显示。它只显示旧值。

这是我的下拉列表 html。

<select id="ddlType" data-bind="options: $root.ddlTypes, optionsText: 'OppType', optionsValue: 'ID', optionsCaption: 'Select..', value: selectedTypeId"></select>

下拉列表正在从 web api 绑定。

请告诉我，我哪里出错了..

提前致谢。

Answer 1

你应该将你的变量声明为可观察的

this.selectedTypeId = ko.observable();

在 HTML 中使用此变量时，根据上下文使用 $root/$parent。

Answer 2

我猜，selectedTypeId 必须在 viewmodel 中是可观察的，这样对此的更改会自动更新 UI。

this.selectedTypeId = ko.observable();