New Participant

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

Forum|Forum|4 years ago
April 13, 2021
2 replies
1482 views

https://experienceleague.adobe.com/docs/experience-manager-65/forms/customize-aem-forms/custom-appearance-widget-adaptive-form.html?lang=en#introduction

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.

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

Mayank_Gandhi

Employee

@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.

D

DavidZhangAuthor

New Participant

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?

Mayank_Gandhi

Employee

@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