THIS IS ARCHIVED DOCUMENTATION

Including a Search Box with OmniboxResultList Results in Cannot read property addEventListener of null Error

This is for:

Developer System Administrator

Coveo for Sitecore (October 2016) Coveo for Sitecore (December 2016)

Symptoms

When including a searchbox with a Coveo for Sitecore OmniboxResultList and a second Coveo Search component, which can either be another searchbox or a Coveo Search Interface, the page turns to white. In the browser console, you get the following error:

"TypeError: Cannot read property 'addEventListener' of null

Cause

The OmniboxResultList is trying to find an input tag under an element with the CoveoSearchbox class. When including two components, the CoveoSearchbox class is picked up, but since the second component isn’t yet initialized, the input doesn’t yet exist.

Resolution

To fix the issue, add an invisible input under the element that’s causing the problem.

  1. Access the Coveo Searchbox file associated with your search page.

    1. When using Web Forms, it should be located under or near <SITECORE_INSTANCE_ROOT>\Website\layouts, and should be a .ascx or .aspx file.

    2. When using MVC, it should be located under or near <SITECORE_INSTANCE_ROOT>\Website\Views, and should be a .cshtml file.

  2. Locate the element with a class CoveoSearchbox in the file.

  3. Inside the div, add the following line:

    <!-- Fix for Coveo for Sitecore 4.0.450 when including two Coveo components and using the OmniboxResultList component. -->
<input style="display:none"></input>

    The integration should look like this:

    <div class="CoveoSearchbox CoveoSearchPageSearchbox" ... >
    <!-- Fix for Coveo for Sitecore 4.0.450 when including two Coveo components and using the OmniboxResultList component. -->
    <input style="display:none"></input>
</div>

  4. Save and close the file.

  5. Repeat the same steps with the Coveo Search file associated to your search page.

    1. When using Web Forms, it should be located under or near <SITECORE_INSTANCE_ROOT>\Website\layouts, and should be a .ascx or .aspx file.

    2. When using MVC, it should be located under or near <SITECORE_INSTANCE_ROOT>\Website\Views, and should be a .cshtml file.