Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Adobe Summit 2023 [19th to 23rd March, Las Vegas and Virtual] | Complete AEM Session & Lab list

We want to integrate jquery select2 plugin as dropdown in AEM forms as custom appearance field, but cannot find a working example


Level 4

Seems custom-appearance-archetype is very old and mvn even cannot build the project after generated. Also, there's no working example and code bundle for this.

The reason we want this is the AEM forms dropdown is not adaptive on small device when the option is very long, it cannot word-wrap.

Please help.


4 Replies


Employee Advisor

@DavidZhang Question for you, why would you have long text in a dropdown anyways. You need to have a tooltip for that. Word wrap in a dropdown would render a very long scroll in a smaller device both for dropdown and for form.

Minify jquery select 2, put it as client libs, and include it in your custom component. 



Level 4

It's legal requirement for the dropdown. So we have to keep the long text.

Also, to include select2, how to integrate with the API to feed the data and event handling? Do you have any working example for any jquery ui plugin to work with forms?


Employee Advisor

@DavidZhang Data binding would be difficult to manage and I can say there is not a document for a similar approach in form. Try creating a wrapper around the default dropdown and feed/bind the values to the default one itslef and use your widget just to display the values. It will all be done in js handler

The ultimate experience is back.

Join us in Vegas to build skills, learn from the world's top brands, and be inspired.

Register Now