Can a select drop down list be added to my winJS toolbar via Javascript?

Question

I have created a toolbar in my windows app which contains a few buttons.

What I want is a select dropdown list along side these buttons but no idea how to create it or append it to the toolbar via Javascript (as the elements of the list will change depending on the dataset I use).

I create my toolbar like so :

//JS

var viewsDataArray = [
    new WinJS.UI.Command(null, { id: 'cmdDelete', label: 'delete', section: 'primary', type: 'button', icon: 'delete', tooltip: 'View 1', onclick: clickbuttonprintout() }),
    new WinJS.UI.Command(null, { id: 'cmdFavorite', label: 'favorite', section: 'primary', type: 'toggle', icon: 'favorite', tooltip: 'View 2', onclick: clickbuttonprintout() }),
                            ];


window.createImperativeToolBar2 = function () {
         var tb = new WinJS.UI.ToolBar(document.querySelector("#toolbarContainer2"), {
                    data: new WinJS.Binding.List(viewsDataArray)
                });
            }

createImperativeToolBar2();

//html 

<div id="toolbarContainer2" style="direction: rtl" ></div>

Answer 1

Try using "content" command type. As per the documentation @ https://msdn.microsoft.com/en-in/library/windows/apps/dn904220.aspx its supposed to support <input> tag.

This creates an Command that can host other HTML markup inside of it, including text, <input> tags, and even a subset of WinJS controls. Only a <div> element can host a content Command.

UPDATE

https://jsfiddle.net/vnathalye/yg0rs4xc/

You need to create a <div> tag and pass it as first param to new WinJS.UI.Command.

Once that is done you can add select drop down or any other control to that div and that should appear in the toolbar. In the above jsfiddle link I've hardcoded select tag in the div.