Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.

Learn to create an AEM component that uses a custom xtype

Avatar

Level 10

Learn about the following AEM functionality:

  • how to develop a CQ component that uses multi-field.
  • how to develop a custom xtype using the AEM widget API.
  • how to read the values entered into custom xtype controls.
  • how to add the custom xtype component to the CQ sidekick. 

See: http://helpx.adobe.com/experience-manager/using/creating-custom-xtype.html.

5 Replies

Avatar

Level 3

Hi, I am fairly new to AEM development (I have been to Developer Training and then our AEM partner's version of Advanced Developer Training) and am just finally having time to start applying what I learned.  I found your article mentioned above and thought I followed it word for word, but unfortunately when I try to add an item on the component I am getting a javascript error: "ejstcustom not found and no default supplied".  I am using AEM 6.0 and I noticed this article was written for 5.6 and therefore was not pointed necessarily at my version.  I have gone back through the article and double checked that I correctly handled all mentions of ejstcustom.  Please see screenshot below where I show that I double-checked the troubleshooting suggestion at the end of your article.

I would really appreciate any suggestions.  Thanks in advance!

Avatar

Level 10

As I mentioned on another forum thread - the versions are listed on the articles - as you correctly pointed out. What the error you are getting means is that CQ is not finding the clientlibs folder where the custom xtype is defined. I am going to test this article on AEM 6 to see if there are any issues. It was tested on 5.5, 5.6, and 5.6.1. 

I will post back the results. 

Avatar

Level 10

Actually - I know the issue. For AEM 6:

"The client libs folder that defines the custom xtype. The category for this client libs folder is cq.widgets. It is strongly recommended that you place custom xtypes in a client libs folder with the cq.widgets category.  "

See this community article where we cover getting custom xtypes to work in AEM 6:

http://helpx.adobe.com/experience-manager/using/creating-touchui-xtypes.html

I will update the article to point to the one listed above. 

Avatar

Level 3

@smacdonald2008 - This helped immensely.  I now have a dialog field that I am able to add things to.  From here I should be able to take it and apply it to the situation I am trying to create (which is similar to what was being done in the article).  Thanks!

A couple of questions and a comment (not necessarily in that order):

Comment - several of the taglibs that you are attempting to include in the JSP are not resolving (I tried copying the URL and hitting it myself and received a 404)

Questions:

  1. What is the exact purpose of the js.txt file (underneath the ClientLibraryFolder)?  Will javascripts that are not listed in it not be pulled in?
  2. Would there be a definitive list somewhere of all AEM 6.0 (and above) articles?  After I found the 5.6 article, I took a quick look to see if I could find a 6.0 version and when I did not I proceeded from there.  Would be nice if there was a listing of these in one place so I could search within the page...

Thanks again!

Avatar

Level 10

The JS.TXT is where you specify the JS files that you want to include in the client libs folder. Simply state all JS files in the JS.txt file

As we continue to write new AEM 6 articles - we will compile a list - that is a great suggestion. I will also update the custom xtype 5.x to point to AEM 6 (for those reading and using AEM 6).

I am glad that you got it working.