Hello,
I am trying to get the search widget to use the maps predefined popup instead of a info window. Any help will appreciated.
Solved! Go to Solution.
Ryan,
I know this thread is old but here is a sample that does that.
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" /> <title>Search with Suggestion Template</title> <link rel="stylesheet" href="https://js.arcgis.com/3.16/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css"> <style> html, body, #map { height: 100%; width: 100%; margin: 0; padding: 0; } #search { display: block; position: absolute; z-index: 2; top: 20px; left: 74px; } </style> <script src="https://js.arcgis.com/3.16/"></script> <script> require([ "esri/map", "esri/dijit/Search", "esri/layers/FeatureLayer", "esri/InfoTemplate", "dojo/on", "dojo/_base/lang", "dojo/domReady!" ], function (Map, Search, FeatureLayer,InfoTemplate, on, lang) { var map = new Map("map", { basemap: "streets", center: [-82.93, 42.5], // lon, lat zoom: 10 }); var fl = new FeatureLayer("https://services.arcgis.com/b6gLrKHqgkQb393u/arcgis/rest/services/TaxParcelQuery/FeatureServer/0", { outFields: ["*"], infoTemplate: new InfoTemplate("Parcels", "Owner name: ${OWNERNME1}</br>Parcel ID: ${PARCELID}</br>Site address: ${SITEADDRESS}") }); map.addLayers([fl]); var search = new Search({ map: map, allPlaceholder: "1627 S Hill Blvd, Bloomfield Twp, Michigan, USA", enableInfoWindow: false }, "search"); on(search,'select-result', function(e) { console.info(e); // Once we have the "mapPoint" object we convert it to a "screenPoint" object on.once(map, 'update-end',lang.hitch(this, function(){ var mpPt = e.result.feature.geometry; var scrPt = map.toScreen(mpPt); map.emit("click", { bubbles: true, cancelable: true, screenPoint: scrPt, mapPoint: mpPt }); })); }); search.startup(); }); </script> </head> <body> <div id="search"></div> <div id="map"></div> </body> </html>
Ryan,
I know this thread is old but here is a sample that does that.
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" /> <title>Search with Suggestion Template</title> <link rel="stylesheet" href="https://js.arcgis.com/3.16/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css"> <style> html, body, #map { height: 100%; width: 100%; margin: 0; padding: 0; } #search { display: block; position: absolute; z-index: 2; top: 20px; left: 74px; } </style> <script src="https://js.arcgis.com/3.16/"></script> <script> require([ "esri/map", "esri/dijit/Search", "esri/layers/FeatureLayer", "esri/InfoTemplate", "dojo/on", "dojo/_base/lang", "dojo/domReady!" ], function (Map, Search, FeatureLayer,InfoTemplate, on, lang) { var map = new Map("map", { basemap: "streets", center: [-82.93, 42.5], // lon, lat zoom: 10 }); var fl = new FeatureLayer("https://services.arcgis.com/b6gLrKHqgkQb393u/arcgis/rest/services/TaxParcelQuery/FeatureServer/0", { outFields: ["*"], infoTemplate: new InfoTemplate("Parcels", "Owner name: ${OWNERNME1}</br>Parcel ID: ${PARCELID}</br>Site address: ${SITEADDRESS}") }); map.addLayers([fl]); var search = new Search({ map: map, allPlaceholder: "1627 S Hill Blvd, Bloomfield Twp, Michigan, USA", enableInfoWindow: false }, "search"); on(search,'select-result', function(e) { console.info(e); // Once we have the "mapPoint" object we convert it to a "screenPoint" object on.once(map, 'update-end',lang.hitch(this, function(){ var mpPt = e.result.feature.geometry; var scrPt = map.toScreen(mpPt); map.emit("click", { bubbles: true, cancelable: true, screenPoint: scrPt, mapPoint: mpPt }); })); }); search.startup(); }); </script> </head> <body> <div id="search"></div> <div id="map"></div> </body> </html>
Thanks Robert. You rule!