私はノックアウトに不慣れで、最初のドロップダウンリストで行った選択に基づいて2番目のドロップダウンリストにデータを入力する方法を作成しようとしています。私はこの会話でrpnによって提供された最初のフィドルに基づいてコードを作成してきました。
これが私のマークアップです
<div data-bind="visible: selectedDate">
<span data-bind="text: selectedDate() ? selectedDate().logDate : 'unknown'"></span>
</div>
<br />
<div data-bind="visible: selectedDate">
<select data-bind="options: filenames,
optionsText: name
value: selectedFiles"
multiple="true"></select>
</div>
とjavascript
var modelData = {Id:1,
DownloadFiles: [
{LogDate:"01/12/2012",
Filenames: [
"File.000", "File.001"]},
{LogDate:"02/12/2012",
Filenames: [
"File.000", "File.001", "File.002"]},
{LogDate:"03/12/2012",
Filenames: [
"File.000", "File.001", "File.002", "File.003"]},
{LogDate:"04/12/2012",
Filenames: [
"File.000", "File.001", "File.002", "File.003"]}
]};
function AvailableDate(date, filenames) {
var self = this;
self.logDate = ko.observable(date);
this.filenames = ko.observableArray(ko.utils.arrayMap(filenames || [], function(filename) {
return new Filename(filename.name);
}));
}
function Filename(name) {
this.name = ko.observable(name);
}
var viewModel = {
downloadFiles : ko.observableArray(),
selectedDate : ko.observable(), // Nothing selected by default
selectedFiles : ko.observableArray() // Nothing selected by default
};
ko.utils.arrayForEach(modelData.DownloadFiles, function(availableDate) {
viewModel.downloadFiles.push(new AvailableDate(availableDate.LogDate, availableDate.filenames));
});
ko.applyBindings(viewModel);
2番目のドロップダウンへのバインドの問題がわかりません。