How to implement Coral.SelectList() feature in Touch UI Dialog | Community
Skip to main content
chaithanya
New Participant
Nov 14, 2018 1:24 PM UTC
Solved

How to implement Coral.SelectList() feature in Touch UI Dialog

Hi

We got requirement to implement multi select feature similar to coral.selectList , could you please provide the steps or reference to implement.

Thanks

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    arunpatidar
    arunpatidarAccepted solution
    New Participant
    Nov 14, 2018 5:06 PM UTC

    Hi,

    You need to get the list from datasource similar like dynamic list from select dropdown

    e.g. aem63app-repo/HelloWorldCompDDServlet.java at master · arunpatidar02/aem63app-repo · GitHub

    You can create your dialog like below

    Arun Patidar
    View reply

    10 replies

    chaithanyaAuthor
    New Participant
    Nov 16, 2018 10:37 AM UTC

    Hi Arun,

    I have updated the coral ui styles and achieved my requirement. Thanks for your support.

    Thanks

    Translate
      arunpatidar
      arunpatidarAccepted solution
      New Participant
      Nov 14, 2018 5:06 PM UTC

      Hi,

      You need to get the list from datasource similar like dynamic list from select dropdown

      e.g. aem63app-repo/HelloWorldCompDDServlet.java at master · arunpatidar02/aem63app-repo · GitHub

      You can create your dialog like below

      Translate
      Arun Patidar
      troubleshooter3
      Level 3
      Sep 29, 2023 9:28 PM UTC

      @arunpatidar  how would you do this today when autocomplete and autocomplete-list are deprecated? 

      Translate
      arunpatidar
      arunpatidar
      New Participant
      Oct 1, 2023 11:06 AM UTC

      you can try writing a custom script

      https://blogs.perficient.com/2019/05/03/how-to-add-a-filter-to-aem-granite-select-widget/ 

      Translate
      Arun Patidar
      chaithanyaAuthor
      New Participant
      Nov 14, 2018 3:53 PM UTC

      Hi Arun,

      Requirement is similar to have like below. Please check coral.selectList() multi select option. It would be great if you can help me on getting the below sample in touch UI

      <coral-selectlist multiple>
              <coral-selectlist-item>Africa</coral-selectlist-item>
              <coral-selectlist-item>America</coral-selectlist-item>
              <coral-selectlist-item>Asia</coral-selectlist-item>
              <coral-selectlist-item>Europe</coral-selectlist-item>
              <coral-selectlist-item>Oceania</coral-selectlist-item>
      </coral-selectlist>

      Translate
      arunpatidar
      arunpatidar
      New Participant
      Nov 14, 2018 3:30 PM UTC

      You need to implement using autocompleteList

      Autocomplete — Granite UI 1.0 documentation

      AutocompleteList — Granite UI 1.0 documentation

      https://aemlab.blogspot.com/2018/08/searchfilter-touch-ui-dialog-dropdown.html

      Translate
      Arun Patidar
      chaithanyaAuthor
      New Participant
      Nov 14, 2018 2:48 PM UTC

      Hi Arun,

      I already checked that, but there is no "selectlist" under "/granite/ui/components/coral/foundation/form" to give to sling:resourceType. Let me know your thoughts.

      Translate
      arunpatidar
      arunpatidar
      New Participant
      Nov 14, 2018 2:43 PM UTC

      Hi,

      Please check https://helpx.adobe.com/experience-manager/6-3/sites/developing/using/reference-materials/coral-ui/coralui3/Coral.SelectList.html

      Translate
      Arun Patidar
      Terms & ConditionsAccessibility statement

      Loading footer...