JSFiddle - React, Tailwind, and code Playground

by Alex Azuero

HTML

<!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>Find Task</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/dojox/grid/resources/Grid.css">
    <link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css">
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; overflow:hidden; }
      body { font-size: 0.9em; font-family: Geneva, Arial, Helvetica, sans-serif;
      } .details { font-weight: bold; } #grid { border:
      1px solid #333;}
    </style>

    <script>var dojoConfig = { parseOnLoad: true };</script>
    <script src="https://js.arcgis.com/3.16/"></script>
    <script>
      dojo.require("dojox.grid.DataGrid");
      dojo.require("dojo.data.ItemFileReadStore");
      dojo.require("esri.map");
      dojo.require("esri.tasks.find");
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");

      var findTask, findParams, map;

      function init() {
        var initExtent = new esri.geometry.Extent({"xmin":-125.0552,"ymin":38.7130,"xmax":-70.2156,"ymax":48.4081,"spatialReference":{"wkid":4326}});
        map = new esri.Map("map", { extent: initExtent });
        var censusMapLayer = new esri.layers.ArcGISDynamicMapServiceLayer("https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer", {
          id: "usa"
        });
        map.addLayer(censusMapLayer);

        //create find task with url to map service
        findTask = new esri.tasks.FindTask("https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer");

        //create find parameters and define known values
        findParams = new...