CODEWITHSUNDEEP
jqueryautocomplete
dallen
dallen

Reputation: 2651

jQuery autocomplete: not getting any results. Any ideas?

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

<script>
$(document).ready(function(){

    $.ajax({
      type: "POST",
      url: "http://localhost:8888/index.php/welcome/get_client/",
      dataType: "json",
      data: "{}",
      success: function(data) {
          var datafromServer = data.split(",");
          ("#search_client").autocomplete({
              source: datafromServer
          });
      },
      error: function(XMLHttpRequest, textStatus, errorThrown) {
         alert(textStatus);
      }
    });

});
</script>

Above is my jQuery code. I actually got it from a tutorial, but for the life of me, I can't seem to get it to work and now I'm wondering if it's my json result from PHP.

My PHP looks like this:

function get_client()
{
    $this->db->select('name')->from('clients');
    $query = $this->db->get();

    header('Cache-Control: no-cache, must-revalidate');
    header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
    header('Content-type: application/json');
    echo json_encode($query->result());
}

When I echo it, it looks like this:

[{"name":"Testing"},{"name":"Testing1"},{"name":"test11"},{"name":"test4"},{"name":"Testing21"},{"name":"Just Testing"},{"name":"testy"}]

I do get the following JavaScript error:

TypeError: Result of expression 'data.split' [undefined] is not a function.

Not sure what to do.

Upvotes: 0

Views: 1060

Answers (3)

dallen
dallen

Reputation: 2651

All this time, the problem was simple: I left the dollar sign off this:

("#search_client").autocomplete({

Upvotes: 0

Adam
Adam

Reputation: 5141

You may want to check the mime-type of your response too, it should be text/json, or application/json I believe.

Edit I'm leaning towards application/json, see the right JSON content-type

Upvotes: 0

Victor
Victor

Reputation: 4721

The data result does not have a property d so data.d.split(","); would be empty. instead try:

$.ajax({
        type: "POST",
        url: "http://localhost:8888/index.php/welcome/get_client/",
        dataType: "json",
        data: "{}",
        success: function(data) {                
            ("#search_client").autocomplete({
                source: data
            });
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
           alert(textStatus);
        }
    });

EDIT: actually there is no need to split the data....

Upvotes: 1

Related Questions