error jquery Autocomplete suggestions is undefined

Question

I am using jquery aucomplete from https://github.com/devbridge/jQuery-Autocomplete/ But it works fine for local and creates problem when using server side script

Error img

enter image description here

My code is like

HTML

<div>
        <input type="text" name="country" id="autocomplete"/>
</div>
<div id="selection"></div>

CSS

.autocomplete-suggestions { border: 1px solid #999; background: #FFF; cursor: default; overflow: auto; }
.autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; }
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong { font-weight: normal; color: #3399FF; }

SCRIPT

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="jquery.autocomplete.js"></script>
<!-- Above js file can be downloaded from
https://github.com/devbridge/jQuery-Autocomplete/blob/master/src/jquery.autocomplete.js
-->
<script type="text/javascript">
    $('#autocomplete').autocomplete({
        serviceUrl: 'search.php',
        onSelect: function(suggestion) {
            $('#selction-ajax').html('You selected: ' + suggestion.value + ', ' + suggestion.data);
        }
    });
</script>

PHP Page SCRIPT search.php

<?php
    if($_REQUEST['query']=='a')
    {
        echo json_encode(array('AD'=>'Adrew','AU'=>'Australia'));
    }
    if($_REQUEST['query']=='b')
    {
        echo json_encode(array('BR'=>'Brazil','BA'=>'Bangladesh'));
    }
    if($_REQUEST['query']=='i')
    {
        echo json_encode(array('IN'=>'India','IND'=>'Indonasia'));
    }
    return;
?>

Thanks for any suggestion.

have you checked this http://stackoverflow.com/questions/11435433/jquery-ui-autocomplete-with-json ? — Robert, May 10 '13 at 10:58
are the html and ´search.php´ on the same server? Otherwise it might have to do with Cross-origin resource sharing — Sonaryr, May 10 '13 at 11:03
have u checked this http://stackoverflow.com/questions/2713642/undefined-results-in-jquery-autocomplete — Ganesh Bora, May 10 '13 at 11:11
@GaneshBora that was `jquery ui` and I am not using it. See my question and the link which I have given in my question. — Rohan Kumar, May 10 '13 at 11:15
as its work fine on local and not working on live menas there will be some issue for connectivity. you can add firebug plugin to firefox and debug what exactly happening, which error it is giving while sending auto-complete request. may be there is some script files are missing which you have used on local but not added on live server. — Ganesh Bora, May 10 '13 at 11:01

score 4 · Accepted Answer · answered May 10 '13 at 12:27

I got the problem

First, it gives error for suggestions.length
Second it was giving problem with suggestion.value.

So the below json encoding works fine

echo json_encode(array('suggestions'=>array(array('data'=>'AU','value'=>'Australia'),array('data'=>'IN','value'=>'India'))));

Full PHP code

<?php
    if($_REQUEST['query']=='a')
    {
        echo json_encode(array('suggestions'=>array(array('data'=>'AU','value'=>'Australia'),array('data'=>'IN','value'=>'India'))));
    }
    else if($_REQUEST['query']=='b')
    {
        echo json_encode(array('suggestions'=>array(array('data'=>'BR','value'=>'Brazil'),array('data'=>'BA','value'=>'Bangladesh'))));
    }
    else if($_REQUEST['query']=='i')
    {
        echo json_encode(array('suggestions'=>array(array('data'=>'IN','value'=>'India'),array('data'=>'IND','value'=>'Indonesia'))));
    }
    else
        echo json_encode(array('suggestions'=>array(array('data'=>'NF','value'=>'Not Found'))));
    return;
?>

Thanks for all whow were given their precious time Thanks once again.

Thank you, for me, I forgot to assign the result to suggestions. — user752746, Apr 30 '19 at 22:34

score 1 · Answer 2 · answered May 10 '13 at 10:57

1

You are echoing the wrong format in PHP, the auto complete needs to receive and array of objects with a value property or label property or both.

You could do something like this

echo json_encode(array('value' => 'AU', 'label' => 'Australia'));

answered May 10 '13 at 10:57

slash197

9,028
6
41
70

It doesn't need to receive a `value` property or `label` property - you can send back whatever `key(s)` you like – billyonecan May 10 '13 at 11:02
You're right but then you have to process the response on client side, with these you have a ready list to be displayed. – slash197 May 10 '13 at 11:04
Its not working but when I used `echo json_encode(array('suggestions'=>array('suggestion'=>array('value' => 'AU', 'label' => 'Australia'))));` It works but now the problem is how can I add more country names in it? – Rohan Kumar May 10 '13 at 11:13

error jquery Autocomplete suggestions is undefined

2 Answers2