Discover the Search widget

24288
65
03-06-2015 05:59 PM
MattDriscoll
Esri Contributor

There’s a new way to easily search your mapping data.

The ArcGIS JavaScript API’s new Search dijit precedes the Geocoder dijit (now deprecated). It’s been re-imagined, renamed and redesigned to provide a single searching and suggestion experience. It allows you to search across multiple Locator and Feature Layer services from a simple interface.

Whereas the Geocoder dijit’s intention was for searching only Locator tasks, the Search dijit was designed to handle multiple types of “sources,” including Locator tasks, Feature Layers and potentially more. The user interface has also been improved to handle searching one more of these sources. With the Search dijit, you can search or get suggestions from all the defined sources or a single source.

Much of the same functionality found in the Geocoder widget is also present in the Search dijit, but many new features have been added and redesigned for a better user and developer experience. As a developer, it should be easier for you to configure the Search widget and less code to write in order to handle common searching tasks. The icons for the widget use a font, so properties like the color or size can easily be modified.

New Features include:

  • Ability to search and get suggestions from Feature Layers
  • Automatically add Feature Layers from a map to the widget
  • Display additional search results to a user in the popup as “more results”
  • Highlight a result with a symbol
  • Label a result with a text symbol.
  • Results for suggestions and searches are separated and have different events
  • Optional button-mode to expand or collapse the search interface from a single button
  • Easily set an InfoTemplate to display custom popup information for a result
  • Individual placeholders for each search source... and more

Have fun exploring the demos or implementing it in your app.

65 Replies
khairulamri
Occasional Contributor

Hi Matt

this is really cool, the app code will be more clean due to the less code.

0 Kudos
williamcarr
Occasional Contributor II

Do you think we will ever be able to use the new Search dijit with Directions similar to locator services? That would take a lot of the trouble out of constant rebuilds.

0 Kudos
MattDriscoll
Esri Contributor

Yep, the plan is to integrate it into the directions widget.

RyanRyherd1
New Contributor

I've been testing this widget with one of my feature layers and everything seems to work great. However, I am having trouble displaying "More Results" in the popup. If I define the infoTemplate with a wildcard "${*}", it displays everything, including "More Results" but not formatted the way I would like. The default seems to display the subsequent results using the ESRI World Geocoder, but I can't seem to get them to display when searching on my own feature layer. Is there something that needs to be added to the content for the infoTemplate to get the "More Results" to show up?

0 Kudos
MattDriscoll
Esri Contributor

Hey Ryan,

Here's how it's formatted by default in an InfoTemplate.

new InfoTemplate(i18n.widgets.Search.main.searchResult, "<div class=\"${searchTheme}\"><div id=\"${searchMoreResultsId}\" class=\"${searchMoreResults}\"><div class=\"${searchMoreResultsItem}\">${searchResult}</div><div>${searchMoreResultsHtml}</div></div></div>")

You can customize it to get it looking how you want. Hope that is what you're looking for.

JohnRitsko
New Contributor III

I have two things.  First, can you point me to where I can see an example of how to use my own locator with the new dijit/Search.  Below is what I use now with the geocoder and want to use this one.

locatorUrl = "";

I tried this but no luck:

      sources.push({

       locator: new Locator("),      

       singleLineFieldName: "SingleLine",

       name: "Clark County Geocoding Service",

       localSearchOptions: {

       minScale: 300000,

       distance: 50000

       },

       placeholder: "Search Local Geocoder",

       maxResults: 3,

       maxSuggestions: 6,

       enableSuggestions: true,

       minCharacters: 0

      });

     

Second,

I do not want the default ESRI World Geocoder, is there a way to remove it as it causes issues when I try to search.

Thanks,

John

0 Kudos
MattDriscoll
Esri Contributor

Hey John, That looks correct. Maybe the singleLineFieldName isn't correct? I'm seeing it as "Single Line Input" on your locator service.

You can set the sources on the widget's constructor and then it won't show the Esri world locator. or instead of pushing to sources, just set sources.

JohnRitsko
New Contributor III

Matt,

Thanks for the correction to "Single Line Input", that fixed it.

Can I set one of the Sources to be my default?

  Going to work on the "Set Sources" next.

Thanks so much,

John

0 Kudos
MattDriscoll
Esri Contributor

Yep! Just set the constructor option for activeSourceIndex to whichever source index you'd like to be the default.

0 Kudos