淘汰js，mvc下拉默认值未选择答案

【问题标题】：Knockout js , mvc drop down default value is not selecting淘汰js，mvc下拉默认值未选择
【发布时间】：2014-07-31 12:43:50
【问题描述】：

看起来很简单，但我做不到。

我已经用来自 c# 的 Json 数据限制了一个下拉列表。

查看页面

<div class="col-md-6">
    <select data-bind="options: VehicleTypes, optionsText: 'Name', optionsValue:'ID', optionsCaption: 'All', value: VehicleTypeId" class="form-control"></select>
</div>

Json 调用

淘汰模型

var baseModel = {
    VehicleTypeId: null,
    VehicleTypes: [],
}

 var viewModel =  ko.mapping.fromJS(baseModel);

 $.get(urlPath + "/GetVehicleTypes", function (data) {     
      viewModel.VehicleTypes(data);
 });

它会填满下拉列表，当我在下拉列表中选择一个值时，VehicleTypeId 的值会更新。

我的问题是我想为我的下拉列表设置一个默认值，我已经用谷歌搜索了它，但对我来说没有任何用处

我在 Json 中返回的数据如下。

[{
    "ID": 32,
    "Name": "Vehicle 1"
}, {
    "ID": 30,
    "Name": "Vehicle 2"
}, {
    "ID": 31,
    "Name": "Vehicle 3"
}]

【问题讨论】：

你是如何设置默认值的？

标签： c# javascript jquery json knockout.js

【解决方案1】：

您的 VehicleTypes 需要位于 observableArray 中，并确保您应用了绑定：

var baseModel = {
                // data
                VehicleTypeId: ko.observable(null),
                VehicleTypes: ko.observableArray([{
                    "ID": 32,
                    "Name": "Vehicle 1"
                }, {
                    "ID": 30,
                    "Name": "Vehicle 2"
                }, {
                    "ID": 31,
                    "Name": "Vehicle 3"
                }]),
            }

            ko.applyBindings(baseModel);

【讨论】：

【解决方案2】：

您必须为 VehicleTypeId 分配一个值，以便设置默认值。

Here 是一个工作示例。

function VehicleTypesViewModel(){
    var self = this;
  self.VehicleTypeId = null;
  self.VehicleTypes = [];   
}    
var viewModel =  new VehicleTypesViewModel();

$.get(urlPath + "/GetVehicleTypes", function (data) {     
  viewModel.VehicleTypeId = 32;
  viewModel.VehicleTypes = data;
  ko.applyBindings(viewModel);
});

【讨论】：

感谢您的快速回复，当然它在 js fiddler 上工作。我注意到当我制作 $.get(urlPath + "/GetVehicleTypes", function (data) { viewModel.VehicleTypeId = 32; viewModel.VehicleTypes = data; ko.applyBindings(viewModel); });
能否请您发布您的 jsFiddle。我已经更新了我的 jsFiddle 以进行实际的 ajax 调用。它工作正常。 jsfiddle.net/CodingDawg/V5q9X/2
对我来说，解决方案是至少使用相同 ID 的热项初始化数组，然后从 ajax 调用中获取数据以填充数组。相同的 ID 意味着如果我的 ajax 调用返回 ID 数组 1001,1002 那么我需要像 tis {"ID": 1001, "Name": ""} function VehicleTypesViewModel(){ var self = this; self.VehicleTypeId = null; self.VehicleTypes = [{ "ID": 32, "Name": "Vehicle 1" }]; }