TinyMCE custom dialog with selectbox not working

For a theme I add a custom menu to WordPress’ TinyMCE using ed.addButton.

Now some of those menu points have more or less elaborate options, so I thought I’d use the custom dialog function of TinyMCE to have the user fill these out. Works fine so far with simple text fields, but as soon as I try to use a selectbox it stops working.

The code looks like this:

ed.addButton('mybutton', {
    type: 'menubutton',
    text: 'My Button',
    icon: false,
    menu: [
        {
            text: 'Bootstrap Well',
            onclick: function () {
                ed.windowManager.open({
                    title: 'Bootstrap Well',
                    body: [
                        {type: 'selectbox', name: 'size', label: 'Size', options: ['small', 'normal', 'large']}
                    ],
                    onsubmit: function (e) {
                        var selected = ed.selection.getContent(),
                                       size = e.data.size;

                        console.log(e.data);

                        ed.insertContent('[well size="' + size + '"]' + selected + '[/well]');
                    }
            });
        }
    }]

The dialog appears no problem, the selectbox is there, no problem. When I submit the dialog I get an event object inside my onsubmit function and the data attribute does contain an object with a key “size”, but the value of the key is always an empty string.

What am I doing wrong here?

Solutions Collecting From Web of "TinyMCE custom dialog with selectbox not working"