MaryJaneO
MaryJaneO

Reputation: 23

Autocomplete for JQuery 3 and Bootstrap

Would appreciate an advice on the best way to achieve autocomplete on the bootstrap page with JQuery 3.

Source has to be a PHP file and can return array or JSON.

Output has to have more than just a label - it has to contain URL and additional text (all are part of JSON/resulting array).

What is the best library to achieve the above with minimum bloat and headache?

Upvotes: 0

Views: 3930

Answers (2)

nazimboudeffa
nazimboudeffa

Reputation: 979

Something like this

    var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags">
</div>

Upvotes: 2

Yush0
Yush0

Reputation: 1656

Jquery UI has an Autocomplete Feature available with JSON datasource: https://jqueryui.com/autocomplete/#remote-jsonp

Upvotes: 0

Related Questions