Knockoutjs id reference to object

Question

Simple Question I think.

I got a Kendo Multiselect which is bound to an array of objects (contentLangs).

From backend I get an array of ints (AvailableLanguages).

Now my problem is how to bind the values correctly.

Do I need a computed or something like this?

Thanks in advance!

<select data-bind="kendoMultiSelect: {
    data: contentLangs ,
    dataTextField: 'Name',
    dataValueField: 'ID',
    value: AvailableLanguages,
    index: 0,
    height: '500'
}"></select>

AvailableLanguages: [0,1]

var contentLangs = [
    { Name: "Deutsch", ID: "DE", Cls: "language-flag flag-de" },
    { Name: "Englisch", ID: "EN", Cls: "language-flag flag-en" },
    { Name: "Italienisch", ID: "IT", Cls: "language-flag flag-it" }
]

Answer 1

So you need to create your view model like so:

var viewModel = {
  availableLanguages: ko.observable([0,1]),
  contentLangs: [
    { Name: "Deutsch", ID: "DE", Cls: "language-flag flag-de" },
    { Name: "Englisch", ID: "EN", Cls: "language-flag flag-en" },
    { Name: "Italienisch", ID: "IT", Cls: "language-flag flag-it" }
  ]
};

contentLangs doesn't need to be an observableArray unless it changes. availableLanguages needs to be an observable because we need to update the viewModel when the selection changes.

Then you can bind the viewModel to the view using:

ko.applyBindings(viewModel);

And the view would be:

<select data-bind="kendoMultiSelect: {
    data: contentLangs,
    dataTextField: 'Name',
    dataValueField: 'ID',
    value: availableLanguages,
    index: 0,
    height: '500'
}"></select>