Как установить выбранную опцию в asp.net mvc, используя knockout.js?

Question

Я пытаюсь установить опцию, выбранную по умолчанию на основе значения, полученного из модели. Я использую asp.net mvc и knockout js для привязки данных.

// Model.TestValue = "DEF"

секция скрипта.

<script>
var model = {
            MyData: ko.mapping.fromJS(@Html.Raw(Json.Serialize(Model)))
        };

ko.applyBindings(model);  
</script>

Просмотр раздела: Razor

@{
   var mydropdownlist = new SelectList(
        new List<SelectListItem>
        {
new SelectListItem {Text = "ABC", Value = "1"},
new SelectListItem {Text = "DEF", Value = "3"},
new SelectListItem {Text = "GHI", Value = "5"}
        }, "Value", "Text");

}

Просмотр раздела HTML.

<select data-bind="options: mydropdownlist, optionsText:'text', value:MyData.testValue "></select>

Сейчас mydropdownlist нормально заполнено, но я не могу установить "DEF", выбранный по умолчанию.

Answer 1

Это то, что вы пытаетесь достичь?

var data = [
  {"text": "ABC","value": 1},
  {"text": "DEF","value": 2},
  {"text": "GHI","value": 3},
  {"text": "JKL","value": 4},
];

var model = {
  mydropdownlist: ko.observableArray(data),
  selectedOption: ko.observable(data[1])
};

ko.applyBindings(model);

Answer 2

Установите наблюдаемое свойство MyData.testValue с обязательной ссылкой на параметр из mydropdownlist.

MyData.testValue (mydropdownlist.Items () [1]);// DEF

Пример:

$ (function () {

    var VmClass = function() {
        self.MyOptions = ko.observableArray([
            { Name: 'Jhon', Age: 45 }, { Name: "Peter", Age: 67 }, { Name: 'Oliver', Age: 90}
        ]);

        self.SelectedOption = ko.observable();

        // can select after binding initialized as well.
        self.ClickMeToSelect = function() {
            self.SelectedOption(self.MyOptions()[2]);
        };
        self.ClickMeToSelect();
    };

    var vmInstance = new VmClass();
    ko.applyBindings(vmInstance, document.getElementById('[element-id]')); 
});