Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn More

View all

Sign in to view all badges

Custom metadata schema field

Avatar

Avatar
Give Back
Level 1
jayap85207566
Level 1

Like

1 like

Total Posts

8 posts

Correct Reply

0 solutions
Top badges earned
Give Back
Ignite 1
Validate 1
Boost 1
View profile

Avatar
Give Back
Level 1
jayap85207566
Level 1

Like

1 like

Total Posts

8 posts

Correct Reply

0 solutions
Top badges earned
Give Back
Ignite 1
Validate 1
Boost 1
View profile
jayap85207566
Level 1

06-04-2017

I have extended the granite UI to create a user picker metadata schema field.  It works fine the first time but when i go back to the metadata schema editor and edit it, the custom user picker changes back to text field.  Not sure why it is happening. Any ideas?

I have followed these steps to create new metadata schema field.

1. In CRXDe Lite, create the following path under /apps/dam:

/apps/dam/gui/coral/components/admin
2. Navigate to /libs/dam/gui/coral/components/admin, and copy the schemaforms folder into the
path created above
3. In open this folder your local apps directly, and navigate to formbuilder. Open the builditems.jsp.

4. At line 66 of the builditems.jsp, added the code snippet to render a new field.

    <li class="field" data-fieldtype="text">
    <div class="formbuilder-template-title">
    <i class="coral-Icon coral-Icon--sizeM coral-Icon--text"></i>
    <span><%= i18n.get("User picker custom") %></span></div>
    <script class="field-properties" type="text/x-handlebars-template">
    <sling:include resource="<%= fieldTemplateResource %>"resourceType="dam/gui/coral/components/admin/schemaforms/formbuilder/formfields/customfield" /></script></li>

5. Navigate back to /apps/dam/gui/coral/components/admin/schemaforms/formbuilder/formfields.
Create a directory called customfield. From the textfield directory (also in this formfields directory),
copy over the textfield.jsp. Rename this coustomfield.jsp.


6. Replace the resourceType calls to refer to a customfield. 

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

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

7. create the following path:
/apps/granite/ui/components/coral/foundation/form/

8. Navigate to the equivalent path under libs.  From here, copy the userpicker folder and paste this into the path you created in the
last step, under apps and rename it to customfield. 

 

Thanks!

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Affirm 1
Level 1
jay_j_s
Level 1

Likes

0 likes

Total Posts

1 post

Correct Reply

1 solution
Top badges earned
Affirm 1
View profile

Avatar
Affirm 1
Level 1
jay_j_s
Level 1

Likes

0 likes

Total Posts

1 post

Correct Reply

1 solution
Top badges earned
Affirm 1
View profile
jay_j_s
Level 1

10-07-2017

I was having a very similar issue. I was able to solve it by adding unique "granite:data/metaType" value in my "customfield.jsp" in builditems.jsp.

Sudo code:

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

Also worthy of note, is that  /libs/dam/gui/components/admin/schemaforms/formbuilder/view.jsp hard-codes "field" to whatever the metaType is when redrawing (second time in the metadata schema editor). So, once the metaType is added and it is same name as your customfield resource (.jsp) name, it seems to work as expected. At least that was my experience.

Example:

Overlayed builditems.jsp

               <li class="field" data-fieldtype="text">

                      <div class="formbuilder-template-title"><i class="coral-Icon coral-Icon--sizeM coral-Icon--text"></i><span><%= i18n.get("My Custom Field") %></span></div>

                      <script class="field-properties" type="text/x-handlebars-template">

                        <sling:include resource="<%= fieldTemplateResource %>"

                                       resourceType="dam/gui/coral/components/admin/schemaforms/formbuilder/formfields/textareafield" />

                    </script>

                  </li>

Custom field JSP (mycustomfield.jsp😞

<%@include file="/libs/granite/ui/global.jsp" %>

<%@ page session="false" contentType="text/html" pageEncoding="utf-8"

         import="org.apache.sling.api.resource.ValueMap,

      com.adobe.granite.ui.components.Config,

      com.adobe.granite.ui.components.Field" %><%

  ValueMap fieldProperties = resource.adaptTo(ValueMap.class);

  String key = resource.getName();

%>

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

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

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

</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="custom-code/components/admin/mycustomproperty">

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

    <%

        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>

Answers (5)

Answers (5)

Avatar

Avatar
Validate 1
Level 1
sreekanthk87
Level 1

Likes

3 likes

Total Posts

11 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
Boost 3
Boost 1
View profile

Avatar
Validate 1
Level 1
sreekanthk87
Level 1

Likes

3 likes

Total Posts

11 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
Boost 3
Boost 1
View profile
sreekanthk87
Level 1

09-03-2018

Does this solution work. I was creating a custom user picker component and experiencing same behavior. It was switching back to text field when I go back to schema editor. I made the highlighted stuff

Does this solution work ? I was facing the same problem and tried  Updating as below.

builditems.jsp

      <li class="field" data-fieldtype="text">

                    <div class="formbuilder-template-title"><coral-icon icon="text" size="M"></coral-icon><span><%= i18n.get("User Picker Custom") %></span></div>

customfield.jsp

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

    <label class="fieldtype coral-Form-fieldlabel">

    <coral-icon icon="text" size="XS"></coral-icon><%= i18n.get("User Picker Custom") %>

    </label>

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

</div>

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

    <input type="hidden" name="<%= xssAPI.encodeForHTMLAttr("./items/" + key) %>">

    <input type="hidden" name="<%= xssAPI.encodeForHTMLAttr("./items/" + key + "/jcr:primaryType") %>" value="nt:unstructured">

    <input type="hidden" name="<%= xssAPI.encodeForHTMLAttr("./items/" + key + "/sling:resourceType") %>" value="granite/ui/components/coral/foundation/form/userpicker">

    <input type="hidden" name="<%= xssAPI.encodeForHTMLAttr("./items/" + key + "/granite:data/metaType") %>" value="text">

Avatar

Avatar
Validate 1
Level 1
sreekanthk87
Level 1

Likes

3 likes

Total Posts

11 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
Boost 3
Boost 1
View profile

Avatar
Validate 1
Level 1
sreekanthk87
Level 1

Likes

3 likes

Total Posts

11 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
Boost 3
Boost 1
View profile
sreekanthk87
Level 1

08-03-2018

HI,

Does anyone implemented a multi select functionality into this userpicker component, like we can select multiple users ? Any help is much appreciated.

Avatar

Avatar
Level 1
mohanl76933159
Level 1

Likes

0 likes

Total Posts

7 posts

Correct Reply

0 solutions
View profile

Avatar
Level 1
mohanl76933159
Level 1

Likes

0 likes

Total Posts

7 posts

Correct Reply

0 solutions
View profile
mohanl76933159
Level 1

24-11-2017

How did you came to know this Extending steps , Did you try creating Custom field like this​ ?

Please provide any pointer / steps to introduce and custom composite multi in my custom meta data schema.

Avatar

Avatar
Give Back
Level 1
jayap85207566
Level 1

Like

1 like

Total Posts

8 posts

Correct Reply

0 solutions
Top badges earned
Give Back
Ignite 1
Validate 1
Boost 1
View profile

Avatar
Give Back
Level 1
jayap85207566
Level 1

Like

1 like

Total Posts

8 posts

Correct Reply

0 solutions
Top badges earned
Give Back
Ignite 1
Validate 1
Boost 1
View profile
jayap85207566
Level 1

10-04-2017

    Making changes directly to lib has the same issue.  

Avatar

Avatar
Validate 1
Level 8
MC_Stuff
Level 8

Likes

78 likes

Total Posts

467 posts

Correct Reply

158 solutions
Top badges earned
Validate 1
Boost 50
Boost 5
Boost 3
Boost 25
View profile

Avatar
Validate 1
Level 8
MC_Stuff
Level 8

Likes

78 likes

Total Posts

467 posts

Correct Reply

158 solutions
Top badges earned
Validate 1
Boost 50
Boost 5
Boost 3
Boost 25
View profile
MC_Stuff
Level 8

07-04-2017

Hi Jay,

AFAIK metadata schema editor use conf folder to see the changes.   Can you make your changes in /libs only rather than /apps & see it works.  If that works then I can guide for next steps of actual fix rather than updating the /libs directly.

Thanks,