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>







7 comments:

  1. I prefer to study this kind of material. Nicely written information in this post, the quality of content is fine and the conclusion is lovely. Things are very open and intenpython interview questions and answers | python tutorials

    ReplyDelete
  2. Well Said, you have furnished the right information that will be useful to anyone at all time. Thanks for sharing your Ideas.

    Java training in Jaya nagar | Java training in Electronic city

    Java training in Chennai | Java training in USA | Java training in Kalyan nagar

    ReplyDelete
  3. Thank you for taking the time to provide us with your valuable information. We strive to provide our candidates with excellent care and we take your comments to heart.As always, we appreciate your confidence and trust in us

    Data Science course in Chennai | Data science course in bangalore

    Data science course in pune | Data science online course

    Data Science Interview questions and answers

    ReplyDelete
  4. This information is impressive; I am inspired with your post. Keep posting like this, This is very useful.Thank you so much. Waiting for more blogs like this.
    Aviation Academy in Chennai
    Aviation Courses in Chennai
    aviation institute in chennai
    best aviation academy in chennai

    ReplyDelete
  5. Fantastic work! This is the type of information that should follow collective approximately the web. Embarrassment captivating position Google for not positioning this transmit higher! Enlarge taking place greater than and visit my web situate

    devops online training

    aws online training

    data science with python online training

    data science online training

    rpa online training

    ReplyDelete