jQuery - Widget AutoComplete
Advertisements
Description
The Widget AutoComplete function can be used with widgets in JqueryUI.The Autocomplete widgets provides suggestions while you type into the field.For suppose give Ja as an input, it will provides an output as Java or JavaScript.
Syntax
Here is the simple syntax to use Autocomplete −
$( "#tags" ).autocomplete({ source: availableTags });
Example
Following is a simple example showing the usage of Autocomplete −
Live Demo<!doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title>jQuery UI Autocomplete - Default functionality</title> <link rel = "stylesheet" href = "//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script> <script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"> </script> <script> $(function() { 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> </head> <body> <div class = "ui-widget"> <label for = "tags">Tags: </label> <input id = "tags"> </div> </body> </html>
This will produce following result −
jquery-widgets.htm
Advertisements