jquery ui autocomplete with database jquery ui autocomplete with database json json

jquery ui autocomplete with database


Finally found the solution that fits my needs

$("#login_name").autocomplete({  source: function(request, response){    $.post("/ajax/login_name.php", {data:request.term}, function(data){             response($.map(data, function(item) {        return {            label: item.user_login_name,            value: item.user_id        }        }))    }, "json");  },  minLength: 2,  dataType: "json",  cache: false,  focus: function(event, ui) {    return false;  },  select: function(event, ui) {    this.value = ui.item.label;    /* Do something with user_id */    return false;  }});


some suggestions:

  1. Why dataType= "jsop"? It doesn't appear to be jsonp. I think you want "json".
  2. insert a cache : false in the options, as well. This insures the request is always made, and never satisfied from browser-side cache.
  3. check if the call is going out, with something like Fiddler or Charles.
  4. does your success fn get called? You have a alert() there. Does it get invoked?
  5. if you have Firebug or the IE8 developer tools, you can put a breakpoint on the alert() to verify the value of the parameters.
  6. Why specify the full hostname in the URL?Last night I had an odd situation with autocomplete where the response was null, the empty string, when I used a different hostname for the page and the Ajax request. When I modified it to use the same hostname, the request succeeded. Actually because of the same origin policy, you should have no hostname at all in the URL for the ajax call.


Yes you do need header info for your json

        header("Expires: Mon, 26 Jul 1997 05:00:00 GMT" );         header("Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . "GMT" );         header("Cache-Control: no-cache, must-revalidate" );         header("Pragma: no-cache" );        header("Content-type: text/x-json");

and tvanfosson makes a good point abut the the plug

in anycase I don't think you make the ajax call the plugin does.

if you are infact using jquery-ui autocomple you should read over the documentation get a basic version running. your php is fine aside from the missing header data