How to add extra button in pathbrowser or path field in dialog | Community
Skip to main content
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 arunpatidar

Hi @naruk89179065 
I tested same with image core component in AEMaaCS SDK, it opens in the new tab OOTB.

Below is the code for the button.


You have to follow the same logic, 

1. Add a button in a dialog : https://developer.adobe.com/experience-manager/reference-materials/6-5/granite-ui/api/jcr_root/libs/granite/ui/components/coral/foundation/button/index.html
2. Write clientlibs, to read the pathfield and open a new tab with page/assets, example page edit path (http://localhost:4502/editor.html/content/aemlab/oneweb/reference-content/image.html)


3 replies

Kamal_Kishor
Community Advisor
Kamal_KishorCommunity Advisor
Community Advisor
December 27, 2023

@naruk89179065 : You can add one more dialog field of type checkbox to specify if page URL should be opened in a new tab.

In HTL file of your component, you have to add 'target' attribute with value '_blank' based on the field value of checkbox field.

for eg:

 

<a href="<page-url>" target="_blank">Link Text</a>

 

You can refer these links for reference:

https://gist.github.com/nateyolles/e5eed811dc9c35961c23

https://www.freecodecamp.org/news/how-to-use-html-to-open-link-in-new-tab/

 

    arunpatidar
    Community Advisor
    arunpatidarCommunity Advisor
    Community Advisor
    December 27, 2023

    HI @naruk89179065 
    Instead of modifying the OOTB path type, you can add additional field(dropdown) with all the possible link target value.

    https://github.com/arunpatidar02/com.aemlab.junitapp/blob/master/ui.apps/src/main/content/jcr_root/apps/JunitApp/components/content/link/_cq_dialog/.content.xml

    https://github.com/arunpatidar02/com.aemlab.junitapp/blob/master/ui.apps/src/main/content/jcr_root/apps/JunitApp/components/dialog/jsons/LinkTarget.json 

    Arun Patidar
      aanchal-sikka
      Community Advisor
      aanchal-sikkaCommunity Advisor
      Community Advisor
      December 27, 2023

      Hello @naruk89179065 

       

      The WCM core button component has an option

       

      Please refer to https://github.com/adobe/aem-core-wcm-components/blob/main/content/src/content/jcr_root/apps/core/wcm/components/button/v2/button/_cq_dialog/.content.xml 

       

      Aanchal Sikka
        N
        naruk89179065Author
        Level 3
        December 27, 2023

        thanks @aanchal-sikka  @arunpatidar @kamal_kishor 
        I am looking for in touch ui dialog level when click Linkbutton/Edit  its should open new tab particular authored URL.
        EX: When drag and drop image its enabled Edit option and click edit option its redirect to dam image root path




          arunpatidar
          Community Advisor
          arunpatidarCommunity AdvisorAccepted solution
          Community Advisor
          December 27, 2023

          Hi @naruk89179065 
          I tested same with image core component in AEMaaCS SDK, it opens in the new tab OOTB.

          Below is the code for the button.


          You have to follow the same logic, 

          1. Add a button in a dialog : https://developer.adobe.com/experience-manager/reference-materials/6-5/granite-ui/api/jcr_root/libs/granite/ui/components/coral/foundation/button/index.html
          2. Write clientlibs, to read the pathfield and open a new tab with page/assets, example page edit path (http://localhost:4502/editor.html/content/aemlab/oneweb/reference-content/image.html)


          Arun Patidar
            Terms & ConditionsAccessibility statement

            Loading footer...