Make ng2 typeahead box in ADF and integrate it into Alfresco 5.2

cancel
Showing results for 
Search instead for 
Did you mean: 
riya_soni42
Active Member

Make ng2 typeahead box in ADF and integrate it into Alfresco 5.2

Hi,

I am now using Alfresco 5.2 version which is compatible with ADF. I  want to customize Alfresco 5.2 Advanced Search Screen, for that I have to make multi select checkbox control and type ahead box in ADF, after I want to integrate that custom page in Alfresco 5.2, and I am new to ADF, so can anyone tell me that how to do this.?

Thanks in advance.

6 Replies
fcorti
Alfresco Employee

Re: Make ng2 typeahead box in ADF and integrate it into Alfresco 5.2

Hi Rya,

Just a confirmation: when you talk about "Alfresco 5.2 advanced search" are you talking About the Alfresco search components or the Alfresco Share Advanced Search?


In the first case, the page here could help you.
In the second case, the ADF is not the right framework and you should check into the Aikau framework. I submit to your attention a page that could be helpful for you case here.

riya_soni42
Active Member

Re: Make ng2 typeahead box in ADF and integrate it into Alfresco 5.2

Hi Francesco,

Thanks for your reply.

Yes, I want to put type ahead control in Alfresco Share Advanced Search UI, when we select particular Content type.

Let us take an example of cm:content, when we select cm:content from menu button, it will render the meta data fields , I want to put type ahead component on that fields, but Alfresco Share Advanced Search UI is made in YUI , so I don't know how to put typeahead component in the meta data fields  or how to convert that page from YUI to Aikau because advsearch.get.html.ftl and advsearch.js contains YUI code.

So, can you provide me the code or any suggestions for this?

Thanks in advance.

fcorti
Alfresco Employee

Re: Make ng2 typeahead box in ADF and integrate it into Alfresco 5.2

Ok, thank you for sharing your requirements.
As a consequence I move the message in the ECM space.
Maybe, Dave Draper can help you with a suggestion.

riya_soni42
Active Member

Re: Make ng2 typeahead box in ADF and integrate it into Alfresco 5.2

Hi Francesco,

thanks a lot...!!!

Another thing I want to ask you that , currently I am making Alfresco Share Advanced Search UI, in that I am giving facility for selecting multiple custom content type from checkboxes, so, when click on multiple content type or even on single content type , I want to hide some meta data fields in that form template on conditional basis, do you know  how can we do that?

Thanks in advance.

ddraper
Intermediate II

Re: Make ng2 typeahead box in ADF and integrate it into Alfresco 5.2

Francesco Corti‌ is correct in that ADF is not the correct choice for this solution because at  the current time it does not easily integrate into Alfresco Share nor doe it provide the components that you are looking for.  Aikau does provide the components that you're looking for and is easily integrates with Share but only to work with existing Aikau pages or create new ones. As you rightly have pointed out the Advanced Search page is a very old page that is written in using Surf / YUI2.

This means that your options are either to take a copy of the existing advanced search code and update it with YUI2 code to fit your requirements (I wouldn't recommend this approach because you'll be using old technology and the solution won't be future proof against upgrades). 

A better approach might be to look into replacing the page with Aikau. Unfortunately there is another issue here in that the advanced search page is driven by the Share forms runtime which is also tightly coupled with the YUI2 implementation. If you have a fixed design for advanced search (i.e just a single form for advanced search as opposed to swapping between forms when you choose a target content type) then you can completely forget about the forms runtime and build an Aikau form to submit your advanced search request - this would be fairly straightforward.

If you want to render different forms as defined in the Share forms runtime then you might want to use this experimental feature in the later Aikau releases which should be sufficient. Have a read through this blog post which although talks about inline advanced search the basic priniciples of using the Aikau forms runtime service remain the same (there are several other posts linked from that one that you should also read).

I don't believe that the underlying API will even support multiple content types however so your actual use case may not even be possible to implement - however I don't know for sure - I would definitely recommend trying to build out and test some requests (using something like Postman) to be sure that you can even achieve your goal before you start working on the UI.

If you go with the Aikau approach then you'll find lots of information in my blogs, a detailed getting started tutorial on the GitHub project, and lots of information on building forms in the video posts embedded in this post. You can also play with some Aikau widgets in the online sandpit and you'll find all the JSDoc online here.

riya_soni42
Active Member

Re: Make ng2 typeahead box in ADF and integrate it into Alfresco 5.2

Hi Draper,

Thanks for your reply,

In alfresco advanced search page, If I have selected cm:content or any other custom content type from menu button, then meta data form fields are rendered,

If I want to make that meta data form field box as auto complete or type ahead so what are the steps for that,

because ftl file of that meta data form fields are by default taken from their type. But, what ftl I have to used if I want to make typeahead or autocomplete,
due to less knowledge of ftl, I don't know that how to go next.

So please provide me the details or any suggestion or any reference link for the same.

Thanks in advance.