Knockout.JS通过AJAX绑定到DropDownList的Observable Array

我想用数据库中的一些下拉选项填充我的视图模型。我想跟踪选定的对象，因为它具有我在其他地方的自定义绑定中使用的属性。Knockout.JS通过AJAX绑定到DropDownList的Observable Array

我使用“空白”值初始化observable，以便在发生绑定和我的自定义绑定时正确设置它。一旦服务器响应，我将数据转换为可观察数组，然后下拉列表显示选项。

下面是JavaScript代码：

ko.bindingHandlers.jq_fade = { 
    init: function (element, valueAccessor) { 
     // Initially set the element to be instantly visible/hidden depending on the value 
     var value = valueAccessor(); 
     $(element).toggle(ko.utils.unwrapObservable(value)); // Use "unwrapObservable" so we can handle values that may or may not be observable 
    }, 
    update: function (element, valueAccessor) { 
     // Whenever the value subsequently changes, slowly fade the element in or out 
     var value = valueAccessor(); 
     ko.utils.unwrapObservable(value) ? $(element).fadeIn() : $(element).fadeOut(); 
    } 
}; 

function Firm(id, name, outsideCounsel) { 
    this.name = name; 
    this.id = id; 
    this.outsideCounsel = outsideCounsel; 
} 

function RequestViewModel() { 
    var self = this, 
     ONE_DAY = 1000 * 60 * 60 * 24; 


    self.firm = ko.observable(new Firm(-1, "", false)); 

    $.post(ajaxAddress + 'LoadFirms', function (data) { 
     var mappedFirms = $.map(data.d, function (item) { 
      return new Firm(item.OrganizationLookupID, item.OrganizationLookupName, item.IsExternalCounselFirm); 
     }); 
     self.availableFirms(mappedFirms); 
     self.firm(self.availableFirms()[0]); 
    }); 
} 


$(document).ready(function() { 
    model = new RequestViewModel(); 
    ko.applyBindings(model); 
});

下面是相关HTML

<span data-bind="jq_fade: firm().outsideCounsel"> 
    Outside Counsel 
    <input type="text" id="outsideCounsel" data-bind="value: outsideCounsel" /> 
</span>

我想是DIV只显示如果选择的公司是一个外部顾问。如果删除行data-bind="jq_fade: firm().outsideCounsel，一切工作正常。如果我同步拨打$.post()，它就会起作用。我在考虑jq_fade中的init函数有问题。

我收到的错误是：

Uncaught Error: Unable to parse bindings. Message: TypeError: Cannot call method 'outsideCounsel' of undefined; Bindings value: jq_fade: firm().outsideCounsel()

我明白了什么淘汰赛告诉我，我只是不知道firm()怎能是undefined，因为我设置的初始值。

来源

2012-02-08 arb

确定服务器返回的数据？如果不是，那么这行self.firm（self.availableFirms（）[0]）;可能会将self.firm重置为undefined – 2012-02-08 21:18:29

您可能必须将“json”指定为$ .post的最后一个参数。 – 2012-02-08 21:24:17

是的，我确定服务器正在返回数据。你指定“json”是正确的。我在页面中进一步做了一个'$ .ajaxSetup（）'调用。 – arb 2012-02-09 14:24:01

如果你结合availableFirms()一个下拉列表，我假设你也已经绑定firm()相同的列表，以便当另一个是从列表中选择，firm()就会自动更新，并且所有绑定自动更新。

如果是这种情况，则根本不需要设置firm()，因为它将设置为下拉列表中的第一个元素。

见例如3浏览：

http://knockoutjs.com/documentation/options-binding.html

var viewModel = { 
    availableCountries : ko.observableArray([ 
     new country("UK", 65000000), 
     new country("USA", 320000000), 
     new country("Sweden", 29000000) 
    ]), 
    selectedCountry : ko.observable() // Nothing selected by default 
};

尝试它像上面没有专门设置firm()，看看它是否再次错误

来源

2012-02-09 14:39:58 soniiic

Knockout.JS通过AJAX绑定到DropDownList的Observable Array

回答

相关问题