xtype Selection dropdown width

[trench999]

We are finding a lot of usability issues with the default width of dialog widgets.  We have been using:

anchor="" width="160"

...for various other components including text inputs and color pickers.  This does not work for selection dropdown.

[smacdonald2008 · Accepted solution]

You can set the width of a dropdown in a custom xtype when you declare the  CQ.form.Selection object using the new operator. See this code:

 this.allowField = new CQ.form.Selection({
            type:"select",
            autoWidth: false,
            width: 700,
            cls:"ejst-customwidget-1",
            listeners: {
                selectionchanged: {
                    scope:this,
                    fn: this.updateHidden
                }
            },
            optionsProvider: this.optionsProvider
        });
        this.add(this.allowField);

This code results in:

[img]DropDownWIdth.png[/img]

For those reading this thread and wanting to know how to develop a custom xtype in a CQ component -- see: 

http://helpx.adobe.com/experience-manager/using/creating-custom-xtype.html

[trench999]

Thanks.  This was a good clue, but does not work in a tabpanel > panel > fieldset dialog.xml config