Made autofill with a simple script. Here is the script

var MIN_LENGTH = 2; $(document).ready(function() { $("#keyword").keyup(function() { var keyword = $("#keyword").val(); if (keyword.length >= MIN_LENGTH) { $.get( "auto-complete.php", { keyword: keyword } ) .done(function( data ) { $('#results').html(''); var results = jQuery.parseJSON(data); $(results).each(function(key, value) { $('#results').append('<div class="item">' + value + '</div>'); }) $('.item').click(function() { var text = $(this).html(); $('#keyword').val(text); }) }); } else { $('#results').html(''); } }); $("#keyword").blur(function(){ $("#results").fadeOut(500); }) .focus(function() { $("#results").show(); }); });

Uploaded site to server agava. And flies to the console "MLHttpRequest cannot load http://err.agava.ru/vh/500.html . No 'Access-Control-Allow-Origin' header is available for the requested resource." What to do?

    2 answers 2

    You should use CORS .

    In simple terms, CORS is a security monitoring system. The server must "allow" your script to load its resources. To do this, it is enough to indicate in the response header Access-Control-Allow-Origin a list of trusted domains.

    Ready examples of use can be found here .

      Add a header to the auto-complete.php file:

      header ('Access-Control-Allow-Origin: *');