Customizing Search Result Renderer

[LizEidsness]

I have seen in the API documentation a reference to SearchResultRenderer class.

SearchResultRenderer | ArcGIS API for JavaScript 4.15 

In addition, I have seen examples where after a search, popup displays "more results".  

I'd like to display that "more results" menu separately from a popup.  Preferably as a list of results before the user pics one.  I have not seen an example where this is done - I'm wondering if anyone has an example I could look at - or if you know how I might leverage that class/something else to create a list in a new location.

I know how to do this:

searchWidget.on("search-complete", function(event){
  // The results are stored in the event Object[]
  console.log("Results of the search: ", event);
});‍‍‍‍

I'm looking for a better way - I'm wondering if SearchResutRenderer might be it or something else.

[Noah-Sager · Accepted solution]

Great question Liz Eidsness‌. You can use the SearchResultRenderer class to do exactly this. The trick is to make sure the viewModel on the SRR is set to the same viewModel as from the Search widget. And you'd probably want to set the showMoreResultsOpen property to `true`. I made an example that (crudely) demonstrates the functionality. If you search for "Plymouth" and hit enter (do not select a suggestion) you'll see the more results in the lower right.

SearchResultRenderer with `next`

https://codepen.io/noash/pen/NWxRbXq 

[LizEidsness]

Thanks!  I was having trouble figuring out how they fit together.

[Noah-Sager]

That's good feedback, we'll improve the doc to make this more obvious.