dxSelectBox won't load data

Question

I have a dxSelectBox as per the demo on the DevExtreme website but I can't get the data to load. Code is as follows:

<div data-bind="dxSelectBox:{datasource: themes, displayExpr: 'name', valueExpr: 'themeId', value: themeId }"></div>

var themesArray = [
    { themeId: 1, name: "Android (Dunkel)" },
    { themeId: 2, name: "Desktop" },
    { themeId: 3, name: "iOS" },
    { themeId: 4, name: "Windows 8" },
    { themeId: 5, name: "Windows Phone 8" },
    { themeId: 6, name: "Tizen" },
    ];

var themes = new DevExpress.data.DataSource(themesArray);

var viewModel = {
    themes: themes,
    viewShowing: function () {
        this.themes.load();
        },
}

Can someone please point me in the right direction?

Thanks in advance

Answer 1

Sigh...

<div data-bind="dxSelectBox:{datasource

That should read dataSource with a big S

Answer 2

Is case of array you can use the "items" option and get rid of DataSource creation:

<div data-bind="dxSelectBox: { items: themesArray, ....