Dropdown field in dialog appears shrinked in size | Community
Skip to main content
A
askdctm
Level 9
July 18, 2016
Solved

Dropdown field in dialog appears shrinked in size

  • July 18, 2016
  • 17 replies
  • 11135 views

Hi All,

Details as below :

We have an issue wherein a dropdown field of type="select" and xtype="selection" with allowBlank="false", defaultValue="6" and itemId="sample" is there.

And itemId is used in one of the listener to show/hide this particular dropdown in the dialog.

Due to this, the dropdown is not appearing properly in the dialog and appearing as seen in the screenshot.

Any thoughts/solution on how to resolve this , will be really helpful.

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 askdctm

Hi All,

Thank you for your reply.

Was using selectionchanged event and the function "function(comp, val, isChecked){..} in the listener. Here in one of the conditions was checking if(val!=''). Removed this condition and it seems to be working ok for now.

17 replies

Show previous replies
A
askdctmAuthor
Level 9
July 22, 2016

Hi Kautuk,

Additional supporting documents.

dropdown here is the dropdown being referred to [type="select" ,xtype="selection", itemId="custom"

In listeners, var Source = dialog.getComponent('custom'); is used and based on certain conditions Source.show(); and Source.hide() is called.

A
askdctmAuthor
Level 9
July 22, 2016

Uploading dialog strcuture

edubey
edubey
Level 10
July 24, 2016

Hi,

I have seen this issue while working with classic UI. Can you set autoWidth = true

Thanks

kautuk_sahni
Community Manager
kautuk_sahniCommunity Manager
Community Manager
July 25, 2016

Hi 

The way you have implemented it, it would have worked. You may like to try what Praveen suggested.

Or

Please have a look at this example:- 

Link:- http://localhost:4502/libs/cq/gui/components/authoring/dialog/dropdownshowhide/clientlibs/dropdownshowhide/js/dropdownshowhide.js

// Extension to the standard dropdown/select component. It enabled hidding/unhidding of other components based on the selection made in the dropdown/select.

How to use:
 *
 * - add the class cq-dialog-dropdown-showhide to the dropdown/select element
 * - add the data attribute cq-dialog-dropdown-showhide-target to the dropdown/select element, value should be the
 *   selector, usually a specific class name, to find all possible target elements that can be shown/hidden.
 * - add the target class to each target component that can be shown/hidden
 * - add the class hidden to each target component to make them initially hidden
 * - add the attribute showhidetargetvalue to each target component, the value should equal the value of the select
 *   option that will unhide this element.
 */

Reference Link, which might help you achieve able stated:- http://adobeaemclub.com/toggle-fields-based-on-selection-in-granite-ui-dialogs/

Thanks and Regards

Kautuk Sahni

Kautuk Sahni
A
askdctmAuthor
Level 9
July 25, 2016

Hi Praveen/Kautuk,

Thank you for your reply. Will check on this and keep you posted.

AnkurAhlawat-1
AnkurAhlawat-1
Level 6
July 26, 2016

I tried to create a dropdown with given configuration type="select" and xtype="selection" with allowBlank="false", defaultValue="6" and itemId="sample" is there. on vanilla instance and it is working fine. Could you please share the listener code and json of your dialog where you are implemention this dropdown.

You can get json by using http://localhost:4502/<path-to-dialog>.-1.json

A
askdctmAuthorAccepted solution
Level 9
July 27, 2016

Hi All,

Thank you for your reply.

Was using selectionchanged event and the function "function(comp, val, isChecked){..} in the listener. Here in one of the conditions was checking if(val!=''). Removed this condition and it seems to be working ok for now.

Terms & ConditionsAccessibility statement

Loading footer...