Javascript pull search completion from web service

Question

I'm a bit new to Javascript and I want to do something I feel like should be pretty simple. I have a web completion service built and I just need to get those completions into the page. I basically want something like this:

<script>
  function(search_string){
    http.request('www.fake.com/search_complete/' + search_string, function(response) {
      response = JSON.parse(response);
      //do something with parsed data
    });
  }
</script>
<input type="search" placeholder="Search..." />

Answer 1

Are you just trying to make a request and use the data returned? If so, just make an ajax request and update the html with the data you get back

var request = new XMLHttpRequest();
request.open('POST','http://www.fake.com/whatever.php?val1='+search_string,true);
request.send();
request.onreadystatechange = function(){
   if(request.readyState == 4 && request.status=200){
      //The request has been completed, handle the data
      var data = JSON.parse(request.responseText);
   }
}

Answer 2

This must help. Example integration of jQuery UI autocomplete from remote web service. http://salman-w.blogspot.in/2013/12/jquery-ui-autocomplete-examples.html

Answer 3

Use jquery:

$.ajax({type: "GET", dataType: 'json', contentType: "application/json", url: "yoururl", success:         function (data) {
        //data is a javascript object that contains the data returned by your webservice json
    }, error: function(xhr, status, error) {
        // Display a generic error for now.
        alert("Error: " + xhr + "   " + status + "   " + error);
      }});

This code will make a call to a webservice using ajax and javascript. It will return the data from the webservice in the data object.