The .ui-dropdownchecklist-selector will be wider than the .ui-dropdownchecklist if the latter's width is set by css

[GoogleCodeExporter]

** What steps will reproduce the problem?

Have multiple dropdownchecklists throughout your site, with a common class. In 
one place (i.e. a general javascript file), you make dropdownchecklists of all 
of these, using a class selector.
But you want to make them differ in width, so you can't provide it in the 
.dropdownchecklist() method.
You use css to set the width, i.e.:

#myTable .aCertainCell .ui-dropdownchecklist { width: 100px; }

This works, but if you added an icon to the dropdownchecklist, and the items in 
the list are wider than 100px, you won't see the icon. This is because the 
.ui-dropdownchecklist-selector will take the width of the items, and will be 
wider.

** What is the expected output? What do you see instead?

I would want the icon to be visible. The .ui-dropdownchecklist-selector should 
not be wider than its parent. The dropdownlist items, should still be wider, so 
the user can read everything.

** What is your environment?
-- DropDownCheckList version: 1.4
-- jQuery version: 1.7.1
-- jQuery UI version: 1.8.16
-- Browser and version: IE8

** Please provide any additional information below/Please attach 

I was able to solve it by adding/changing this to the _setSize function:

var control = this.controlSelector;
var controlParentWidth = control.parent().width();
controlWidth = controlParentWidth < controlWidth ? controlParentWidth : 
controlWidth;
control.css({ width: controlWidth + "px" });

Original issue reported on code.google.com by peter.mo...@gmail.com on 14 Feb 2012 at 3:21

[GoogleCodeExporter]

DDCL was not designed to accommodate widths as set by CSS.  That is why the 
'width' option was provided. But it certainly seems like a good idea, so I will 
try to incorporate this as an enhancement in a future version.

Thanks for the input.

Original comment by womohun...@ittrium.com on 20 Feb 2012 at 3:04

• Changed state: Accepted
• Added labels: Type-Enhancement
• Removed labels: Type-Defect