jQuery Auto Complete

You can utilize the following example to provide a single line text item with auto complete functionality based on data from an external third party source.

Here is an example of how the item actually appears :

Javascript Auto Complete Example

Sample code :

$('#myfield').autocomplete({
    source: function (request, response) {
        $.ajax({
            url : "https://help.checkbox.com/api/v2/help_center/en-us/articles.json",
            success: function(data){
                response($.map(data.articles, function(item){
                    console.log(item);
                    return {
                        label: item.name,
                        value: item.name
                    }
                }));
            }
        });
    }
});

You can see an example of exactly what is returned from the above ajax call :

{
  "articles": [
    {
      "id": 213056063,
      "url": "https://checkbox.zendesk.com/api/v2/help_center/en-us/articles/213056063-Providing-Results-to-Respondents.json",
      "html_url": "https://help.checkbox.com/hc/en-us/articles/213056063-Providing-Results-to-Respondents",
      "author_id": 353093071,
      "comments_disabled": false,
      "label_names": [
        "chrome"
      ],
      "draft": false,
      "promoted": false,
      "position": 0,
      "vote_sum": 1,
      "vote_count": 1,
      "section_id": 202550803,
      "created_at": "2013-03-19T17:00:46Z",
      "updated_at": "2016-10-14T21:25:25Z",
      "name": "Providing Results to Respondents",
      "title": "Providing Results to Respondents",
      "body": "Body of my article",
      "source_locale": "en-us",
      "locale": "en-us",
      "outdated": false
    }