xtype Selection dropdown width | Community
Skip to main content
trench999
Level 4
October 16, 2015
Solved

xtype Selection dropdown width

  • October 16, 2015
  • 2 replies
  • 1898 views

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.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by smacdonald2008

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

2 replies

smacdonald2008
smacdonald2008Accepted solution
Level 10
October 16, 2015

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
trench999Author
Level 4
October 16, 2015

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