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

SOLVED

Touch-Ui DropDown with multiselect

Avatar

Level 6

Hi,

 

In Touch-Ui I can create a dropdown selection populated from an ajax call that returns JSON.

I need to be able to select 1 .. n values in the selection.

I have 2 problems

1) Add multiselect to dropdown

2) Have a list multiple values selected by the author be available for processing in JSP.

 

Regards

Clive Stewart

1 Accepted Solution

Avatar

Correct answer by
Administrator

Hi 

As mentioned by Andrew's, for multi-select:-

Link:- https://docs.adobe.com/docs/en/aem/6-1/ref/granite-ui/api/jcr_root/libs/granite/ui/components/founda...

// multipleboolean: Indicates if the user is able to select multiple selections.

Example:

+ myselect
  - sling:resourceType = "granite/ui/components/foundation/form/select"
  - emptyText = "Select"
  - name = "myselect"
  + items
    + option1
      - text = "op1"
    + option2
      - text = "op2"

 

And For populating the Dropdown via Ajex, 

Please refer to this community article:- https://helpx.adobe.com/aem-forms/6/dynamically-populate-dropdowns.html

Package:- https://helpx.adobe.com/content/help/en/aem-forms/6/dynamically-populate-dropdowns/_jcr_content/main...

I hope this solves your problem.

 

Thanks and Regards

Kautuk Sahni

View solution in original post

4 Replies

Avatar

Administrator

Hi 

For populating the Dropdown via Ajex, 

Please refer to this community article:- https://helpx.adobe.com/aem-forms/6/dynamically-populate-dropdowns.html

Package:- https://helpx.adobe.com/content/help/en/aem-forms/6/dynamically-populate-dropdowns/_jcr_content/main...

 

For Multi-Select i also need to figure it out.

 

Thanks and Regards

Kautuk Sahni

Avatar

Level 1

Hi Clive,

You can add multi-select to the select component by adding multiple="{Boolean}true". Your component would look something like this:

<selectExample jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/foundation/form/select" fieldLabel="Multi Select Example" multiple="{Boolean}true" name="./selectExample"> <items jcr:primaryType="nt:unstructured"> <foo jcr:primaryType="nt:unstructured" text="Foo" value="foo"/> <bar jcr:primaryType="nt:unstructured" text="Bar" value="bar"/> </items> </selectExample>    

The selected values will display as tags below the select input. I've noticed that there are some bugs with this when you place the multi-select inside a multifield component.

Avatar

Correct answer by
Administrator

Hi 

As mentioned by Andrew's, for multi-select:-

Link:- https://docs.adobe.com/docs/en/aem/6-1/ref/granite-ui/api/jcr_root/libs/granite/ui/components/founda...

// multipleboolean: Indicates if the user is able to select multiple selections.

Example:

+ myselect
  - sling:resourceType = "granite/ui/components/foundation/form/select"
  - emptyText = "Select"
  - name = "myselect"
  + items
    + option1
      - text = "op1"
    + option2
      - text = "op2"

 

And For populating the Dropdown via Ajex, 

Please refer to this community article:- https://helpx.adobe.com/aem-forms/6/dynamically-populate-dropdowns.html

Package:- https://helpx.adobe.com/content/help/en/aem-forms/6/dynamically-populate-dropdowns/_jcr_content/main...

I hope this solves your problem.

 

Thanks and Regards

Kautuk Sahni

Avatar

Level 6

Thank you Kautuk,

I have gone through the example you gave and have been able to resolve the issue as a result.

 

regards

Clive