Gulan
Gulan

Reputation: 84

J Query auto complete display result in un ordered list?

I want to show result JQuery auto complete result in unordered list, how to create it. Java script code

$("#seachbox").autocomplete("result.ashx", {
            width: 200,
            formatItem: function (data, i, n, value) {

          return =""; //---- ?
},

html

<ul>
    <li>
        <a href='#'><img src='It_img/studentpic.jpg' '/> Name of student</a> 
    </li>
</ul>

Upvotes: 0

Views: 193

Answers (2)

dreamweiver
dreamweiver

Reputation: 6002

There are few extension plugins(extension points) in jQuery UI Api specifically designed for this

_renderMenu:

 _renderMenu: function( ul, items ) {
    var that = this;
    $.each( items, function( index, item ) {
        that._renderItemData( ul, item );
    });
 //after list population is complete, add some additional css classes or operations like this below
 $( ul ).find( "li:odd" ).addClass( "odd" );
}

Method that controls building the widget's menu. The method is passed an empty <ul> and an array of items that match the user typed term. Creation of the individual <li> elements should be delegated to _renderItemData().

For More Info :http://api.jqueryui.com/autocomplete/#method-_renderMenu

Happy Coding :)

Upvotes: 1

Geras Ghulyan
Geras Ghulyan

Reputation: 1

  $(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
    });
  });

Here is the link, how it warks and examples. http://jqueryui.com/autocomplete/#default

Upvotes: 0

Related Questions