<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="en" /></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 of search area , 10 is bangkok , 1007 is pathumwan district
• tag: Tag such as hospital,school
• locale: Select language of returning result (th, en)
• offset: Offset of the first result returned
• limit: Number of results returned
• span: Span with unit in deg, m or km