Hello,
In the cq touch dialog for the component A added to page .
1> I will need to add a disabled field to the dialog which will show component path added to the page,
2> Also just side of it need a copy button so that we can copy the field value.
So if the page path was /content/application/en/page the component path will be /content/application/en/page/jcr:content/componentA
I will need to copy this value and added this component path to different component B dialog , then component A path will used in component B slightly code with data-sly-resource.
Please let me know how could be achieve it.
Regards,
Srinivas
Solved! Go to Solution.
Views
Replies
Total Likes
You can add two fields to component from where you want to copy the path :
<compPath
jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/text"
granite:class="actual-component-path"
text="${requestPathInfo.suffix}"/>
<button
jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/button"
granite:class="copy-component-path"
text="Copy component path"/>
And then can write small js to copy it on click of button
Sample js
$(".copy-component-path").click(function(){
var button = $(this);
var compPath = button.parent().find(".actual-component-path").text(); navigator.clipboard.writeText(compPath);
})
And if I may suggest an alternative approach, you can write a sling model in your second component and can easily find the first component's path which you want to include in that sling model using a simple query or any other option that you find suitable.
Then call that sling model in your HTL to get the component path and include in data-sly-resource. Will save you all the hassle of going through copy/past etc.
Hope this helps.
Views
Replies
Total Likes
You can add two fields to component from where you want to copy the path :
<compPath
jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/text"
granite:class="actual-component-path"
text="${requestPathInfo.suffix}"/>
<button
jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/button"
granite:class="copy-component-path"
text="Copy component path"/>
And then can write small js to copy it on click of button
Sample js
$(".copy-component-path").click(function(){
var button = $(this);
var compPath = button.parent().find(".actual-component-path").text(); navigator.clipboard.writeText(compPath);
})
And if I may suggest an alternative approach, you can write a sling model in your second component and can easily find the first component's path which you want to include in that sling model using a simple query or any other option that you find suitable.
Then call that sling model in your HTL to get the component path and include in data-sly-resource. Will save you all the hassle of going through copy/past etc.
Hope this helps.
Views
Replies
Total Likes
Views
Likes
Replies