How to make Auto Complete Text Input (List)?

You should try out jQuery UI's Autocomplete[^] box. If you go to that website, you will find the basic working of Autocomplete and how you can implement it in your website.

You can use this code to create the autocomplete feature for an input element. 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
});

This was a hardcoded string of available tags, you can somehow call to get the dynamic data from database or some other source. Then use them inside this variable from where the autocomplete would tag the items. You can use Ajax to get the data too.

CSS styling can be applied to the HTML for a different design. A test is present on their website, check it own there.