0
私はサーバーから来るajaxデータを持っています。このデータでは、選択ボックスを生成する必要があります。 this codeをご覧ください：ノックアウト - オプションとforeachバインディングを一緒に使う方法
var dataCameFromServer = {
foo: "1",
bar: "sag",
results: [
{
slectedBoxID: null,
selectBoxOptions: [
{
id: 1,
name: "mosi"
},
{
id: 2,
name: "azi"
},
{
id: 3,
name: "mom"
},
{
id: 4,
name: "dad"
}
]
},
{
slectedBoxID: 2,
selectBoxOptions: [
{
id: 1,
name: "tehran"
},
{
id: 2,
name: "masal"
},
{
id: 3,
name: "gilan"
},
{
id: 4,
name: "rasht"
}
]
},
{
slectedBoxID: 1,
selectBoxOptions: [
{
id: 1,
name: "adidas"
},
{
id: 2,
name: "nike"
},
{
id: 3,
name: "rebook"
},
{
id: 4,
name: "puma"
}
]
}
]
};
function selectViewModel() {
var self = this;
this.data = ko.observable(dataCameFromServer);
this.sbValue = ko.observableArray();
ko.computed(function() {
$.each(self.data().results, function(i,v) {
self.sbValue.push(v.slectedBoxID);
});
});
ko.computed(function(){
console.log(self.sbValue());
});
}
ko.applyBindings(new selectViewModel(), $("#wrapper")[0]);<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div id="wrapepr">
<!-- ko with: data -->
<!-- ko foreach : results -->
<select data-bind="options:selectBoxOptions,optionsText: 'name',optionsValue: 'id',value: $root.sbValue()[$index],optionsCaption: 'Choose...'"></select>
<!-- /ko -->
<!-- /ko -->
</div>私はslectedBoxIDで、私の選択ボックスは、その対応するslectedBoxIDの変化の値を変更した場合であるオプションで選択し、デフォルトでは、私の選択ボックスをしたいです。
これを行うためのアドバイスはありますか？
p.s：サーバーからの結果の数がわかりませんが、この3つの結果だけではありません。