topic Re: Query task with Autocomplete in ArcGIS JavaScript Maps SDK Questions

Query task with Autocomplete

AshishArora — Mon, 01 Apr 2013 08:05:39 GMT

Please share an example of Autocomplete text search using query task.

Re: Query task with Autocomplete

MattLane — Fri, 10 Dec 2021 22:03:22 GMT

ESRI has a geocoder widget with autocomplete here, and it's built into 3.4 I believe.

Here is an autocomplete I wrote a while back with jQuery UI and an ESRI query endpoint:

  $('#txtSearch').autocomplete({
    source: function (request, response) {
      $.ajax({
        url: "http://someurl/ArcGIS/rest/services/someservice/MapServer/0/query",
        dataType: "jsonp",
        data: {
          where: "FIELDNAME LIKE '" + request.term.replace(/\'/g, '\'\'') + "%'",//makes single quotes into double for sql
          outFields: "FIELDNAME",
          returnGeometry: false,
          f: "pjson"
        },
        success: function (data) {
          if (data.features) {
            response($.map(data.features.slice(0, 9), function (item) {//only display first 10
              return { label: item.attributes.FIELDNAME, value: item.attributes.FIELDNAME }
            }));
          }
        }
      });
    },
    minLength: 3,
    select: function (event, ui) {
      this.blur();
      var query = new esri.tasks.Query();
      query.returnGeometry = true;
      query.outFields = ["*"];
      query.where = "FIELDNAME = '" + ui.item.value.replace(/\'/g, '\'\'') + "'";
      queryTask.execute(query,
        fxns.showQueryResult,
        function (e) {
          alert(e.toString());
        }
      );
    }
  });

Re: Query task with Autocomplete

AshishArora — Fri, 10 Dec 2021 22:03:25 GMT

ESRI has a geocoder widget with autocomplete here, and it's built into 3.4 I believe.

Here is an autocomplete I wrote a while back with jQuery UI and an ESRI query endpoint:

  $('#txtSearch').autocomplete({
    source: function (request, response) {
      $.ajax({
        url: "http://someurl/ArcGIS/rest/services/someservice/MapServer/0/query",
        dataType: "jsonp",
        data: {
          where: "FIELDNAME LIKE '" + request.term.replace(/\'/g, '\'\'') + "%'",//makes single quotes into double for sql
          outFields: "FIELDNAME",
          returnGeometry: false,
          f: "pjson"
        },
        success: function (data) {
          if (data.features) {
            response($.map(data.features.slice(0, 9), function (item) {//only display first 10
              return { label: item.attributes.FIELDNAME, value: item.attributes.FIELDNAME }
            }));
          }
        }
      });
    },
    minLength: 3,
    select: function (event, ui) {
      this.blur();
      var query = new esri.tasks.Query();
      query.returnGeometry = true;
      query.outFields = ["*"];
      query.where = "FIELDNAME = '" + ui.item.value.replace(/\'/g, '\'\'') + "'";
      queryTask.execute(query,
        fxns.showQueryResult,
        function (e) {
          alert(e.toString());
        }
      );
    }
  });

Thanks Matt,

I will give it a try 🙂