Gravatar for

Question by abuteau, Jul 1, 2014 1:24 PM

Overriding Search Interface Options after init

Hi guys,

I have a Global SearchBox and a Result Page. I want to have data-enable-history = true. However, something override my settings on the Result Page and I get data-enable-history = false, so I'm unable to search in the URL.

1- Is there a way to override SearchInterface after Settings ?

To try to resolve that issue I've tried two things

A- Init manually the SearchInterface in the Result Template with

    Coveo.$('#search').coveo('init', {
        SearchInterface: {
            autoTriggerQuery: true,
            hideUntilFirstQuery: false,
            enableHistory: true

Worked, data-enable-history=true, but the search is called twice, so I get 2 results.

B- Init the Global SearchBox and re-using it in the Search Page

Not working I get enableHistory = false and the SearchBox is still called twice in the result page.

C- Adding options before init

    Coveo.$(function() {
        var options = @(Html.Raw(Model.GetJavaScriptInitializationOptions()));
        options.CoveoSearchInterface = {};
        options.CoveoSearchInterface.enableHistory = true;
        Coveo.$('#search').coveoForSitecore('init', options);                                     

Still get overrided.

Would be easier if I could just know why the enableHistory get overrided or a way to override after init.

I'm with the June(latest) Build of the JS Search.

Code is available here:

3 Replies
Gravatar for

Answer by olamothe, Jul 2, 2014 11:54 AM

If you want to see how the option are set, put a breakpoint in the constructor method of the SearchInterface component in your browser console. In the code, ctrl+f for something that looks like this :

function SearchInterface(element, options, analyticsOptions) {...}

You should see a line like this :

this.options = new DefaultSearchInterfaceOptions(element).merge(options);

Inspect the options variable. This variable should hold the option you set in the init call, like this:

 $('#search').coveo('init', {
     SearchInterface : {
        enableHistory: true

Then, step into

new DefaultSearchInterfaceOptions(element)
, and you should see a line of code like this

this.enableHistory = this.loadBooleanFromAttribute("data-enable-history", false);

What this line mean is : read the attribute data-enable-history on the element, and if it's undefined, set it to false.

Check if the attribute is set correctly.

And the merge call will combine the options from init with the one set directly on the SearchInterface tag and create the final options object for your SearchInterface.

This should help you debug from where the bad config is coming from.

Gravatar for

Answer by Martin Laporte, Jul 2, 2014 3:34 AM

The settings specified in the attributes overrides the ones specified throught init options. In what I assume is your search page you're setting many attributes using values from @Model. If those aren't the value you want they'll "win" and there is no way init options can override that. So, first I'd look at the generated html/js and look for "history" to determine what is being set where for real.

Then, for an external search box you should really use "initSearchBox", but be again be careful what options are set on your tags (or passed as options to "initSearchBox"), because those will override the defaults defined by initSearchBox.

And finally, if you have problems with double queries, it's typically because you are calling init/initSearchBox twice. You should call init only once in your search page, and only "initSearchBox" in other pages (e.g. no init).

Gravatar for

Comment by abuteau, Jul 2, 2014 9:08 AM

Strange enough data-enable-history is set to true id="search" class="CoveoSearchInterface" data-enable-history="True" data-results-per-page="10" data-excerpt-length="200" data-hide-until-first-query="True" data-auto-trigger-query="True"

Gravatar for

Comment by Martin Laporte, Jul 2, 2014 9:20 AM

I have no idea myself where those values from from. Any Coveo for Sitecore folks is willing to help?

Gravatar for

Comment by abuteau, Jul 2, 2014 9:31 AM

I fixed the call twice issue. Thanks for that. The value are set in the Sitecore interface where I can modify the Coveo Search View Layout and set the value to true or false. Currently, they are all set to true. However, I have tried to look almost everywhere where the values could be overrided after the initialization and I don't have a clue where I could search now. That's why I was willing to hard-code an override.

Gravatar for

Comment by Luc Bergeron, Jul 2, 2014 11:59 AM

Are you still calling both coveo('init') and coveoforsitecore('init') from your search page? You should call only coveoforsitecore('init') because it already calls coveo('init') under the hood.

Gravatar for

Comment by abuteau, Jul 2, 2014 1:58 PM

True. Now, I only call coveoForSitecore. My searchbox was called twice because of init on both .coveoForSitecore and .coveo I was confused by a mix of Global SearchBox and stand alone SearchBox

Gravatar for

Answer by abuteau, Jul 2, 2014 1:55 PM

Thanks to all.

I'm on a development with a lot of custom code and we have a lot of custom layout. The custom layout are there to recreate the default interface of the client. My view layout (MVC) is modified to have more placeholder and not only coveo-search-mvc.

With the Olivier tip I saw that the SearchInterface options was overrided by the other layout. Inside the

this.enableHistory = this.loadBooleanFromAttribute("data-enable-history", false)

function the data-enable-history was undefined thus getting the default false value.

The solution was just to move up Coveo Search View before my other layout in Presentation-> Detail -> Edit -> Controls

Ask a question