How to add a path field to Asset Metadata

[ravitejasurampu]

Hi All,

I am trying to add a Path Browser to a custom tab for asset metadata. I have followed the documentation and created a custom schema. But the options in the build form section are limited as shown below

We have a requirement where we have to link existing dam assets to pages/third party websites. This was possible in the classic UI as a metadata property. How can we extend this to the new Coral UI?

Thanks,

Ravi

[ravitejasurampu]

No worries. I just managed to find the solution. The following configuration needs to be overlayed and updated

/libs/dam/gui/coral/components/admin/schemaforms/formbuilder

Update buildforms.jsp

Update form fields folder - Create a new folder (in my case pathfield)

Create  a new jsp pathfield.jsp  and link it to the pathbrowser widget

Here is my path browser code

<div class="formbuilder-content-form">

    <label class="fieldtype"><i class="coral-Icon coral-Icon--sizeXS coral-Icon--text"></i><%= i18n.get("Path Browser") %></label>

    <sling:include resource="<%= resource %>" resourceType="granite/ui/components/foundation/form/pathbrowser"/>

</div>

<div class="formbuilder-content-properties">

    <input type="hidden" name="./items/<%= key %>">

    <input type="hidden" name="./items/<%= key %>/jcr:primaryType" value="nt:unstructured">

    <input type="hidden" name="./items/<%= key %>/sling:resourceType" value="granite/ui/components/coral/foundation/form/pathbrowser">

    <input type="hidden" name="./items/<%= key %>/granite:data/metaType" value="path">

    <input type="hidden" name="./items/<%= key %>/renderReadOnly" value="true">

    <%

        String resourcePathBase = "dam/gui/coral/components/admin/schemaforms/formbuilder/formfieldproperties/";

        String[] settingsList = {"labelfields", "metadatamappertextfield", "placeholderfields", "requiredfields", "disableineditmodefields", "showemptyfieldinreadonly", "titlefields"};

        for(String settingComponent : settingsList){

            %>

            <sling:include resource="<%= resource %>" resourceType="<%= resourcePathBase + settingComponent %>"/>

            <%

        }

    %>

    <i class="delete-field coral-Icon coral-Icon--delete coral-Icon--sizeL" href="" data-target-id="<%= key %>" data-target="./items/<%= key %>@Delete"></i>

</div>