Dynamize Ajax Autocomplete Jquery with json data

4

I want to make dynamic suggestions with this API . < br>

How to streamline the suggestion file by listing data from the mysql database?

  

Download DEMO:    link

The file countries.js is what contains the suggestion dictionary, but manually, I want something dynamic with the suggestions registered in the bank being listed in it.

countries.js

    var countries = {
    "AD": "Andorra",
    "AE": "United Arab Emirates",
    "AF": "Afghanistan",
    "AG": "Antigua and Barbuda",
    "AI": "Anguilla",
    "AL": "Albania",
    "AM": "Armenia",
    "WK": "Wake Island",
    "WS": "Samoa",
    "YD": "People's Democratic Republic of Yemen",
    "YE": "Yemen",
    "YT": "Mayotte",
    "ZA": "South Africa",
    "ZM": "Zambia",
    "ZW": "Zimbabwe",
    "ZZ": "Unknown or Invalid Region"
}

API Manual Instructions

Response format The server response should be JSON formatted following JavaScript object:

{
    // Query is not required as of version 1.2.5
    "query": "Unit",
    "suggestions": [
        { "value": "United Arab Emirates", "data": "AE" },
        { "value": "United Kingdom",       "data": "UK" },
        { "value": "United States",        "data": "US" }
    ]
}

The data can be any value or object. Data object is passed to formatResults function and onSelect callback . Alternatively, if there is no data you can only provide a string array for suggestions, such as:

{
    "query": "Unit",
    "suggestions": ["United Arab Emirates", "United Kingdom", "United States"]
}
    
asked by anonymous 10.11.2014 / 21:17

1 answer

3

As in the example of the site that was mentioned, you must add a URL in the serviceUrl attribute in the component configuration object, something like.

This URL should point to a server-side page that returns a JSON in the format you want. You can set this by modifying the request headers. In PHP, you can still serialize the object in json directly, as in the example below.

<?PHP
$data = /** Objeto a serializar **/;
header('Content-Type: application/json');
echo json_encode($data);

On this page you should use the format you already know to access the database, etc.

    
11.11.2014 / 14:27