Question

一个简单的主要细节场景：服务器列表

int id
string Name
List<Driver> Drivers

其中，Driver也有Id和Name。从服务器上的MVC Action返回JSON。

现在我有一个knockoutjs模型

  var ViewModel;
  var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };
  ViewModel = {
    IpAddress: ko.observable($("#IpAddress").val()),
    Servers: ko.observableArray([]),
    SelectedServer: ko.observable()
  };
  ViewModel.ValidIp = ko.dependentObservable(function() {
    return /^(([2]([0-4][0-9]|[5][0-5])|[0-1]?[0-9]?[0-9])[.]){3}(([2]([0-4][0-9]|[5][0-5])|[0-1]?[0-9]?[0-9]))$/i.exec(this.IpAddress());
  }, ViewModel);
  ViewModel.GetSnmpData = ko.dependentObservable(function() {
    if (this.lastSnmpRequest) {
      this.lastSnmpRequest.abort();
    }
    if (this.ValidIp()) {
      return this.lastSnmpRequest = $.ajax({
        url: GetPrinterDataUrl,
        type: "POST",
        data: {
          IpAddress: this.IpAddress()
        },
        success: __bind(function(data) {
          this.Servers(data.Servers);

        }, this)
      });
    }
  }, ViewModel);
  ko.applyBindings(ViewModel);

和一些绑定

<input name="IpAddress" id="IpAddress" type="text" data-bind="value: IpAddress ,valueUpdate: 'afterkeydown'" value=""/>
<select name="ServerId" id="ServerId" data-bind="options: Servers,optionsText:'Name' ,optionsValue:'Id', value: SelectedServer"  />  
<select name="DriverId" id="DriverId" data-bind="options: SelectedServer()? SelectedServer().Drivers: null,optionsText:'Name',optionsValue:'Id'">

问题是：服务器下拉列表已填充，而驱动程序则未填充。我肯定错过了一些东西。也许我需要使用映射插件？

Answer 1

SelectedServers（）返回server.Id而不是server对象。

尝试在ServerId中删除optionsValue: 'Id'选择：

<input name="IpAddress" id="IpAddress" type="text" data-bind="value: IpAddress ,valueUpdate: 'afterkeydown'" value=""/>
<select name="ServerId" id="ServerId" data-bind="options: Servers, optionsText:'Name', value: SelectedServer"></select>
<select name="DriverId" id="DriverId" data-bind="options: SelectedServer()? SelectedServer().Drivers: null,optionsText:'Name',optionsValue:'Id'"></select>

如何使用json和knockoutjs创建主细节级联下拉列表？

1 个答案: