Typeahead Search with Custom Pages

[John L_]

Hello.

I am in the process of developing an HR Service Portal, I am having a lot of difficulty customizing the behavior of the default search bars. When I clone the typeahead-search widget, and try to use the cloned version, I receive errors that angular could not find the sp-typeahead.html template:

This happens whenever I change the nested widget from the HR Homepage Search widget, like so:

Server Script:

//From
data.typeAheadSearch = $sp.getWidget('typeahead-search', options.typeahead_search);
//To
data.typeAheadSearch = $sp.getWidget('my_typeahead_search', options.typeahead_search);

Where my_typeahead_search is an unmodified clone of typeahead-search.

Perhaps I'm going about this the wrong way, but I am making this modification so that I can change our search results to the HR pages, rather than the default Service Catalog pages which this widget produces. (e.g. hri_sc_catalog rather than sc_catalog)

Does anyone know how to either:

A) Successfully clone typeahead-search and use it on a page without the template error?

B) Modify the search results of this widget to go to the HR pages?

Thank you in advance for any help.

-John

[Mike Patel · Accepted solution]

Looks like you are missing the template; Just open cloned widget and make sure you have template like below;

[John L_]

Adding the template fixed my issue.

Thank you for your help.

-John

[BhupeshG]

It only shows New option . NO edit option. If I add with same ID , I get an error Message .. Invalid Insert.

Do I need to create a copy of Typeahead.html and then associate with a different portal. I have OTB and Custom portal in my instance.