绑定下拉(选择)列表的初始/默认值 [英] Binding initial/default value of dropdown (select) list

问题描述

我在设置下拉列表的初始值时遇到了一个小问题.下面的代码是视图模型定义和$(document).ready中的初始化.我有一个名为 sourceMaterialTypes 的数组和一个 selectedSourceMaterialType 表示该数组的选定值.我正在使用来自 (ASP.Net MVC) 模型和 ViewBag 的值初始化视图模型.

I'm having a small issue with setting the initial value of a dropdown. The code below is the view model definition and the initialization in $(document).ready. I have an array called sourceMaterialTypes and a selectedSourceMaterialType representing the selected value of that array. I am initializing the view model with values from the (ASP.Net MVC) Model and ViewBag.

var viewModel = {
    sourceMaterialTypes : 
        ko.observableArray(@Html.Raw(Json.Encode(ViewBag.SourceMaterialTypes))),
    selectedSourceMaterialType :
        ko.observable(@Html.Raw(Json.Encode(Model.SourceMaterialType))),
    ingredientTypes :
        ko.observableArray(@Html.Raw(Json.Encode(ViewBag.IngredientTypes))),
    selectedIngredientType : ko.observable()
};

$(document).ready(function () {

    ko.applyBindings(viewModel);

    viewModel.selectedSourceMaterialType.subscribe(function(newSourceMaterialType) {
        $.getJSON("/IngredientType/FindByMaterialType",
                  { "id": newSourceMaterialType })
            .success(function (data) {
                viewModel.ingredientTypes($.parseJSON(data));
            })
            .error(function () { alert("error"); });
    });
});

以下是我的下拉(选择)列表与 Knockout 绑定定义的定义.

The following is the definition of my dropdown (select) list with the Knockout binding definition.

<select id="SourceMaterialTypeId"
        name="SourceMaterialTypeId"
        data-bind="options: sourceMaterialTypes,
                   optionsText: 'Name',
                   optionsValue : 'Id',
                   value: selectedSourceMaterialType"></select>

这一切都很好，除了源材料下拉列表中最初选择的值(selectedSourceMaterialType 被正确绑定，所以当下拉选择更改其值时正确更新，这只是我的初始选择有问题)，它始终是我的视图模型上 sourceMaterialTypes 数组中的第一项.

This all works fine except for the initially selected value in the source materials dropdown (selectedSourceMaterialType is bound correctly so when the dropdown selection changes its value is correctly updated, it is only the initial selection I am having a problem with), which is always the first item in the sourceMaterialTypes array on my view model.

我希望最初选择的值是从(服务器端)模型初始化的值作为 selectedSourceMaterialType 视图模型属性的值.

I would like the initially selected value to be that which is initialized from the (server-side) model as the value of selectedSourceMaterialType view model property.

推荐答案

我猜你只需要在 selectedSourceMaterialType 可观察函数中传递 Id 而不是整个对象 ->

I guess you need to pass the Id only and not the whole object in the selectedSourceMaterialType observable function ->

selectedSourceMaterialType: ko.observable(@Model.SourceMaterialType.Id)

这篇关于绑定下拉(选择)列表的初始/默认值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！