topic Re: parse search widget 4.4 to a html search form in ArcGIS JavaScript Maps SDK Questions

parse search widget 4.4 to a html search form

Henryobaseki — Tue, 25 Jul 2017 14:58:14 GMT

Hi All,

The code would normally work using Javascript 4.3, my search widget outside my mapView but seems not to be working in 4.4.

Any help please. Thanks I advance

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Search Widget - 4.4</title>

  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>

  <link rel="stylesheet" href="https://js.arcgis.com/4.4/esri/css/main.css">
  <script src="https://js.arcgis.com/4.4/"></script>

  <script>
    require([
      "esri/Map",
      "esri/views/SceneView",
      "esri/widgets/Search",
      "dojo/domReady!"
    ], function(
      Map,
      SceneView,
      Search) {

      var map = new Map({
        basemap: "satellite",
        ground: "world-elevation"
      });

      var view = new SceneView({
        scale: 123456789,
        container: "viewDiv",
        map: map
      });

      var searchWidget = new Search({
        view: view
      });

      // Add the search widget to the very top left corner of the view
      
    console.log(document.getElementById("submitButton"))
    document.getElementById("submitButton").onclick = (e)=> {
      e.preventDefault()
      let el = document.getElementById("input")
      console.log(el.value)
     
      searchWidget.search(el.value).then((result)=> {
        console.log("result", result)
      })
    }
       });
        
    
  </script>
</head>

<body>
  <div>
    <form>
      <input placeholder="Enter your address" type="text" id="input">
      <button id="submitButton">Submit</button>
    </form>
  </div>
  <div id="viewDiv"></div>
</body>

</html>
 

Re: parse search widget 4.4 to a html search form

KellyHutchins — Tue, 25 Jul 2017 17:23:48 GMT

I ran a quick test using your code (added to jsbin) and it worked for me. I searched for Olympia, WA hit submit and was zoomed to that location.

JS Bin - Collaborative JavaScript Debugging

Can you provide more info about the issue you are seeing?

Re: parse search widget 4.4 to a html search form

Henryobaseki — Tue, 25 Jul 2017 17:55:51 GMT

Thanks Kelly Hutchins,

I think its the browser I m using need it to be displayed in IE and not google chrome. Any ideas?

Re: parse search widget 4.4 to a html search form

KellyHutchins — Tue, 25 Jul 2017 18:36:58 GMT

I'm not sure what is up with JSBIN I just tested with Edge and it didn't work but if I copied the code locally and ran from my web server on Edge the search worked. What behavior are you seeing? When you test your app locally in IE does the map load, are there any console errors?

Re: parse search widget 4.4 to a html search form

Henryobaseki — Tue, 25 Jul 2017 19:40:16 GMT

It wont load Map because I think I m running the app from a c drive. How do I run it from a web server I think this should resolve the issue any hints please?

Re: parse search widget 4.4 to a html search form

KellyHutchins — Tue, 25 Jul 2017 19:47:35 GMT

You can find details about web servers by following the links in the 'About web servers' section of the 'System Requirements' doc.

System Requirements | ArcGIS API for JavaScript 4.4