Friday, 28 February 2014

Filled Under:

autocomplete jquery example

                                The Autocomplate provide live search without page refresh while you type in the text field. in this example i have suggestions are tags for programming languages like click on demo and type programming languege name like php,javascript,html,css etc... here is the search datasource is a simple javascript string. follow some below step to implement autosuggestion in your website easily.



first include those file


 <link rel="stylesheet" href="jquery-ui.css">
<script src="jquery-1.9.1.js"></script>
<script src="jquery-ui.js"></script>

and put this code in side of the <head>



 <script>
  $(function() {
    var availableTags = [
      "PHP",
      "HTML",
      "HTML5",
      "CSS",
      "CSS3",
      "C++",
      "jQuery",
      "JavaScript",
      "Lisp",
      "Perl",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  });
  </script>


html code


<div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags">
</div>







0 comments:

Post a Comment