Touch-Ui DropDown with multiselect | Community
Skip to main content
C
Clive_Stewart
New Participant
June 1, 2016
Solved

Touch-Ui DropDown with multiselect

  • June 1, 2016
  • 4 replies
  • 12573 views

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

    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 kautuk_sahni

    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/foundation/form/select/index.html

    // 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-pars/download/file.res/dropdown-demo-content-1.0.1-SNAPSHOT.zip

    I hope this solves your problem.

     

    Thanks and Regards

    Kautuk Sahni

    4 replies

    C
    Clive_StewartAuthor
    New Participant
    June 17, 2016

    Thank you Kautuk,

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

     

    regards

    Clive

    kautuk_sahni
    kautuk_sahniAccepted solution
    Employee
    June 16, 2016

    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/foundation/form/select/index.html

    // 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-pars/download/file.res/dropdown-demo-content-1.0.1-SNAPSHOT.zip

    I hope this solves your problem.

     

    Thanks and Regards

    Kautuk Sahni

    Kautuk Sahni
    andrew_bowles1
    andrew_bowles1
    New Participant
    June 15, 2016

    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.

      kautuk_sahni
      kautuk_sahni
      Employee
      June 10, 2016

      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-pars/download/file.res/dropdown-demo-content-1.0.1-SNAPSHOT.zip

       

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

       

      Thanks and Regards

      Kautuk Sahni

      Kautuk Sahni
      Terms & ConditionsAccessibility statement

      Loading footer...