DevBridge autocompletion

Question

im trying to use DevBridge Autocomplete downloaded from https://www.devbridge.com/sourcery/components/jquery-autocomplete/

But i cant get it to work :(

I have a HTML input field looking like this:

<input type="text" name="city" size="12" value="City" id="autocomplete" autocomplete="off">

In the same file i got my JavaScript:

<script src="autocomplete/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="autocomplete/jquery.mockjax.js" type="text/javascript"></script>
<script src="autocomplete/jquery.autocomplete.js" type="text/javascript"></script>
<script type="text/javascript">
$('#autocomplete').autocomplete({
    serviceUrl: '/cities.php',
    onSelect: function (suggestion) {
        alert('You selected: ' + suggestion.value + ', ' + suggestion.data);
    }
});
</script>

An example output of cities.php?autocomplete=aach looks like this:

{ "suggestions": [ { "value": "Aach ", "data": "Aach " },{ "value": "Aacha ", "data": "Aacha " },{ "value": "Aachen ", "data": "Aachen " } ] } 

What am i missing? Thx for help!

Answer 1

it might be the url issue , try instead of cities.php?autocomplete=aach the "cities.php?query=aach" request. I think by default jquery-autocomplete sends some_url?query=key_word .

Answer 2

Check the Devbridge documentation. It specify that if want to change the query string parameter name then you have to set the paramName option.

In your case set it as while initializing the autocomplete widget:

paramName:"autocomplete"

Line from Documentsation:

paramName : Default query . The name of the request parameter that contains the query.