Gravatar for dipsindol@gmail.com

Question by DEEPTHI KATTA, Oct 18, 2016 4:19 PM

Custom No Results Message on Tabs

Goal is to customize search results message when a coveo tab yields no results based on filters. I dont see any documentation around this. I saw a post on how to customize error message, but, that seems like when coveo search is down. https://developers.coveo.com/display/public/SitecoreV4/Overriding+the+Search+Friendly+Error+Message Also, saw another one on locale string, but, not helpful on Tabs https://answers.coveo.com/questions/1848/coveo-search-view-customizations?

Gravatar for sbelzile@coveo.com

Comment by Sébastien Belzile, Oct 18, 2016 4:30 PM

In other words, you want the "no results back message" to be different for every tab?

Gravatar for dipsindol@gmail.com

Comment by DEEPTHI KATTA, Oct 19, 2016 1:41 PM

Yeah. I would love that. But, if I can get away with doing same message on both if it is tricky. Also, can I make this message content editable like the way you guys do on error messages by pulling from Dictionary?

1 Reply
Gravatar for flguillemette@coveo.com

Answer by François Lachance-Guillemette, Oct 19, 2016 4:22 PM

Hi @Dipsindol :)

I have experimented a bit and managed to change the "No results back for" message using the following code:

var searchId = "<%= Model.Id %>";
Coveo.$("#" + searchId).on("deferredQuerySuccess", function(e, data) {
    if(data.results.totalCount == 0) {
        Coveo.$("#" + searchId  + " .coveo-query-summary-no-results-string").text(GetCustomNoResultsMessage());
    }
});

The current query is accessible using data.query.q.

For more information about this event and its properties, refer to: https://coveo.github.io/search-ui/interfaces/iquerysuccesseventargs.html

While I think it would be better if the JavaScript Framework supported this feature, this should work quite nicely for your use case.

FLG

Gravatar for dipsindol@gmail.com

Comment by DEEPTHI KATTA, Oct 19, 2016 5:26 PM

Works beautifully!!!! Only catch is I have tabs, so obviously one tab could have data coming and one need not necessarily have it. So, I added else. It looks something like

    Coveo.$(function() {    
        var searchId = '@Model.Id';        
        Coveo.$('#@Model.Id').on("deferredQuerySuccess", function(e, data) {
        if(data.results.totalCount == 0) {
        Coveo.$("#" + searchId  + " .coveo-query-summary-no-results-string").text(GetEmptySearchText());
      }
      else
      {
         Coveo.$("#" + searchId  + " .coveo-query-summary-no-results-string").text(" ");
      }
    });
        CoveoForSitecore.componentsOptions = @(Html.Raw(Model.GetJavaScriptInitializationOptions()));
    });

Curious question, so, there is no way to see which tab Coveo is actually performed search for? It would have been super awesome if I have access to that

Gravatar for flguillemette@coveo.com

Comment by François Lachance-Guillemette, Oct 19, 2016 5:45 PM

data.query has the IQuery interface, which means you can access the selected tab with data.query.tab.

I don't think you need to have the else part though, since the coveo-query-summary-no-results-string section is hidden when there are results.

Gravatar for dipsindol@gmail.com

Comment by DEEPTHI KATTA, Oct 19, 2016 6:09 PM

Oh..let me see what gets back on query.tab in data. Regards to else, I dont think so, is there is a specific place I will need to place this div? I dont see this being added dynamically by Coveo. I was adding a div manually that has class coveo-query-summary-no-results-string Am I missing something? Oh Could Coveo be adding this only if there is a search box component. I dont have search box on my rendering

Gravatar for flguillemette@coveo.com

Comment by François Lachance-Guillemette, Oct 20, 2016 7:48 AM

The div with the coveo-query-summary-no-results-string class is automatically added when you have no results with the CoveoQuerySummary component. If you have this component, the only this you have to change is its text inside.

You can get the current tab with the data.query.tab provided in the deferredQuerySuccess event, like so:

Coveo.$('#@Model.Id').on("deferredQuerySuccess", function(e, data) {
   var currentTab = data.query.tab;
   console.log(currentTab);
});
Ask a question