<div id="searchbar">
  <div>
    Keyword: <input id="searchbox" type="text"  />
    <button id="searchbutton">search</button>
  </div>
  <table>
    <tr>
      <td>lat: </td><td><input id="lat" type="text" value="13.5" /></td>
      <td>lon: </td><td><input id="lon" type="text" value="100.7" /></td>
      <td>span: </td><td><input id="span" type="text" value="100km" /></td>
      <td>area: </td><td><input id="area" type="text" value="" /></td>
    </tr>
    <tr>
      <td>tag: </td><td><input id="tag" type="text" value="hotel" /></td>
      <td>locale: </td><td><input id="locale" type="text" value="th" /></td>
      <td>offset: </td><td><input id="offset" type="text" value="0" /></td>
      <td>limit: </td><td><input id="limit" type="text" value="20" /></td>
    </tr>
  </table>
</div>

<div id="searchresult"></div>

var suggestTimeout;
var suggestKeyword = null;
var searchKeyword = null;
var suggestList = [];

$(function() {
  $('#searchbox').keyup(function(event) {
    if (event.keyCode == 13) {
      doSearch();
      return;
    }
    clearTimeout(suggestTimeout);
    suggestTimeout = setTimeout(doSuggest, 500);
  });
  $('#searchbutton').click(doSearch);
});

function doSuggest() {
  var value = $('#searchbox').val();
  if (value == suggestKeyword) return;
  if (value.length < 3) {
    $('#searchresult').html('Type at least 3 characters');
    return;
  }
  suggestKeyword = value;
  searchKeyword = null;
  $('#searchresult').empty();
  var data = { keyword: suggestKeyword };
  if ($('#area').val()) data.area = $('#area').val();
  if ($('#offset').val()) data.offset = $('#offset').val();
  if ($('#limit').val()) data.limit = $('#limit').val();
  $.getJSON('https://search.longdo.com/mapsearch/json/suggest?key=' + apikey, data, function(msg) {
    if (msg.meta.keyword != suggestKeyword) return;
    var html = '';
    for (var i = 0; i < msg.data.length; i++) {
      suggestList[i] = msg.data[i].w;
      html += '<a href="javascript:suggestClick(' + i + ')">' + msg.data[i].d + '</a><br />';
    }
    $('#searchresult').html(html);
  });
}

function suggestClick(index) {
  $('#searchbox').val(suggestList[index]);
  doSearch();
}

function doSearch() {
  clearTimeout(suggestTimeout);
  suggestKeyword = null;
  searchKeyword = $('#searchbox').val();
  $('#searchresult').empty();
  var data = {};
  if (searchKeyword) data.keyword = searchKeyword;
  $('#searchbar input').each((_, item) => {
    if (item.value) data[item.id] = item.value;
  });
  $.getJSON('https://search.longdo.com/mapsearch/json/' + $('#mode').val() + '?key=' + apikey, data, function(msg) {
    if (msg.meta.keyword != searchKeyword && msg.meta.keyword != 'tag: ' + data.tag) return;
    var html = 'start: ' + msg.meta.start + ' end: ' + msg.meta.end + ' hasmore: ' + msg.meta.hasmore + '<ol>';
    for (var i = 0; i < msg.data.length; i++) {
      html += '<li>' + msg.data[i].name + '</li>';
    }
    $('#searchresult').html(html + '</ol>');
  });
}

• lat: พิกัด Latitude
• lon: พิกัด Longitude
• area: รหัส geocode จังหวัด/อำเภอ/ตำบล
• tag: หมวดหมู่ในการค้นหา เช่น โรงแรม, โรงเรียน, โรงพยาบาล เป็นต้น
• locale: ภาษาของผลการค้นหา เช่น th, en เป็นต้น
• offset: ลำดับของผลการค้นหา เช่น ต้องการดูผลการค้นหาตั้งแต่ลำดับที่ 21 ให้ใส่ 20 ลงในช่อง
• limit: จำนวนผลลัพธ์ที่ต้องการ
• span: ขอบเขตของการค้นหา เช่น 100m, 1000km เป็นต้น