topic Re: Search widget: how to disconnect default click handlers in ArcGIS JavaScript Maps SDK Questions

Search widget: how to disconnect default click handlers

AndrewMurdoch — Tue, 22 Dec 2015 16:04:30 GMT

I'm using WAB Dev edition 1.2 and JSAPI 3.14.

I think this question is core to JSAPI 3.14 and Dojo, though, so I am not posting direct to a WAB forum...

I have been using the Search dijit/widget and I'm now trying to alter the UI/UX so that when the user clicks on the "submitNode" (the magnifiying glass icon to the right of the search box), the user is NOT taken to the "first" search result. For now, I simply want to completely disable that button / node. Ultimately, I will reconnect a click handler to do something custom (open a window showing a complete, comprehensive list of all search results that match the current search criteria).

I ALSO want to disable the "enter" key action on the search text box (in a similar fashion) so that the user is NOT taken to the "first" search result.

I AM using the suggest function to present a dropdown list of the top results as the user types in a partial search criteria string, and I DO let the user click on a suggest result in that list to zoom to the desired result.

How do I disable the "click" handlers for the default functionality of the Search widget?

Any guidance is greatly appreciated!

Andrew

Re: Search widget: how to disconnect default click handlers

ErwinSoekianto — Tue, 29 Dec 2015 23:48:29 GMT

I don't think this is possible thru the ArcGIS Javascript API as these type of functionalities are not exposed and documented in the documentation, Search | API Reference | ArcGIS API for JavaScript

Re: Search widget: how to disconnect default click handlers

RobertScheitlin__GISP — Wed, 30 Dec 2015 01:04:27 GMT

Andrew,

I agree with Erwin. I spent some time trying to hack this and using aspect before, etc I was not able to disconnect the default handler. Probably if I spend more time I could, but I did not figure it out when I was working this question.

Re: Search widget: how to disconnect default click handlers

AndrewMurdoch — Wed, 30 Dec 2015 14:44:50 GMT

That is what I was afraid of.

I'm thinking that to get where I want to go with the interface, I will need to create a new widget interface that leverages an instance of the JSAPI Search (and the "search()" method) behind the scenes (not placed in a DOM node). This would allow me to use the multiple sources functions in the Search API, which we are using quite a bit.

This could be quite a project.

Thanks for your input!

Andrew

Re: Search widget: how to disconnect default click handlers

AndrewMurdoch — Wed, 30 Dec 2015 14:48:20 GMT

Does it sound like it might be possible to create a new widget interface calling a "headless" JSAPI Search dijit (not applied to a DOM node) using the documented "search()" method? Not really looking forward to that, but I'm sure I'll learn something new!

Thanks for your feedback!

Andrew

Re: Search widget: how to disconnect default click handlers

RobertScheitlin__GISP — Wed, 30 Dec 2015 14:51:06 GMT

Andrew,

I would say that is sounds like a sound plan that is possible.

Re: Search widget: how to disconnect default click handlers

KellyHutchins — Sun, 12 Dec 2021 04:14:20 GMT

I may not be reading the question correctly but perhaps setting autoSelect and autoNavigate to false when you create the widget will get you what you need.

You could then setup a click handler on the search button to do something else. Here's an example:

         var searchWidget = new Search({
            map: map,
            autoSelect: false,
            autoNavigate: false
         }, "search");
         searchWidget.startup();
         
         query(".searchBtn.searchSubmit").on("click", function(){
            console.log("Search button clicked with value of " + searchWidget.value);
         });

Re: Search widget: how to disconnect default click handlers

AndrewMurdoch — Thu, 31 Dec 2015 22:12:27 GMT

Thanks for this Kelly!

Using autoSelect = false DID prevent both the enter key and the "submit button" click event from selecting and zooming to the first match in the list. Halfway there! The enter key and submit button click DO still call the server to return results, but at least they don't automatically act on the first result now.

I did then need to add an event listener on the "search-results" event (which is still called by both the enter key and the "submit button" click, as well as being called by clicking on a result in the "suggestion results list").

The WAB Search widget event listener setup looks like this:

this.own(on(this.searchDijit, 'search-results', lang.hitch(this, "showSearchResults")));

In the event handler (showSearchResults), I had to do some handling of different geometry types (for selecting, rendering and zooming) and whether there were a single match or multiple matches in multiple "source" objects. I haven't yet made a popup dialog to show the results of multiple results in the "search-results" object, but I'm part way there.

Thanks again!

Andrew

Re: Search widget: how to disconnect default click handlers

DarinaTchountcheva — Mon, 29 Feb 2016 19:08:37 GMT

Hi guys,

I was wondering if any of you have found a way to prevent the Search widget from automatically performing a search when a suggested value is selected?

Not having a database supporting pagination is messing me up, and I have to create locators from my layers to use the suggestion functionality, but I need to perform the search on the feature layers and actually return polygons instead of the point that locators return.

I see that I can hop in after the search is performed and results are returned, and do what I need to do, but that's kind of chatty.

Thank you!