モデルからのドロップダウンリストの設定値に直面する問題

Question

MVCをKnockoutJsで使用していて、valueバインディングの問題があります。

@Html.DropDownListFor(m => m.PrimarySubspecialty, Model.PrimarySubspecialties, new { id = "ddUserDetailsPrimarySubSpeciality", style = "width:245px;height:25px;", @class = "nmc-select", data_bind = "options: primarySubSpecialities,optionsText: 'Name',optionsValue: 'Id',value:PrimarySubspecialty" }) 

モデルでPrimarySubspecialty値がドロップダウン選択した値にバインド取得されていない理由を私はわかりません。

は、ここに私のJSコードです：

this.PrimarySubspecialty = Ko.observable($('#ddUserDetailsPrimarySubSpeciality').val()); 
this.primarySubSpecialities = ko.observableArray([]); 

function loadPrimarySubSpecilaities() { 
    $.ajax({ 
     type: 'GET', 
     url: primarySubSpecialityUrl, 
     contentType: 'application/json; charset=utf-8', 
     dataType: 'json', 
     processdata: false, 
     cache: false, 
     success: function (data) { 

      primarySubSpecialities = []; 

      try { 
       if (data.length == 0) { 

        primarySubSpeacilityDropdownId.empty(); 

       } 
       model.primarySubSpecialities(data); 
      } 
    }); 
} 

私はPrimarySubSpecialityドロップダウンに値を設定する方法を教えてください。

Answer 1

非同期メソッドを使用してドロップダウンまたはリストを選択するときは、選択した値をにバインドしないように注意してください。の前にリストが埋められます。

リストを変更した場合、Knockoutはリストに存在する場合のみバインドされた値を保持します。そうでない場合、値は未定義と設定されます。

、あなたのコードを修正する変数に値を保存し、リストだけが満たされている後に観察設定するには：

var holdingValue = $('#ddUserDetailsPrimarySubSpeciality').val(); 
this.PrimarySubspecialty = Ko.observable(); 

が続いて値を設定し、リストがいっぱいになるとは：

model.primarySubSpecialities(data); 
model.PrimarySubspecialty(holdingValue); 

私はこのことを実証するための簡単なJSFiddleテストページを作成しました：https://jsfiddle.net/Quango/0bxaqLf8/