首页 > 解决方案 > 淘汰赛 JS 选择初始值在 foreach 循环内未正确显示

问题描述

我有一个案例,当我有一个项目列表并且对于其中的每个项目,我需要显示一个编辑特定字段的下拉列表

发生的情况是,当我编辑选择并保存时,更改已正确绑定并保存。

但是当我第一次加载页面时,所有选择都反映了第一个项目(该值被忽略)

  <tbody data-bind="foreach: Model.Items">

    ///something

          <select data-bind="value: Fieldvalue,options: $root.optionslist,  optionsValue: 'Id', optionsText: 'Name'"></select>

    ///something

  </tbody>

标签: c#asp.net-mvcknockout.js

解决方案


这是我设置初始值然后加载 DOM 并绑定值的示例。它按预期工作。您的问题可能出在您未向我们展示的代码的其他部分。

var viewmodel = function(){
  
  this.Model = {
    Items: [
      {Fieldvalue: ko.observable(2)},
      {Fieldvalue: ko.observable(3)}
    ]
  };
  this.optionslist = [
    {Id: 1, Name: 'option 1'},
    {Id: 2, Name: 'option 2'},
    {Id: 3, Name: 'option 3'}
  ];
};

ko.applyBindings(new viewmodel());
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>


<div data-bind="foreach: Model.Items">
    <select data-bind="value: Fieldvalue,
                       options: $root.optionslist,  
                       optionsValue: 'Id', 
                       optionsText: 'Name'"></select>
</div>


推荐阅读