Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
324 views
in Technique[技术] by (71.8m points)

javascript - Autocomplete textbox with hyperlink

I want a autocomplete or auto suggest textbox with hyperlink on each suggested value like if we g it show result google or when we select google it redirect to google.com.

Please any one help me out of this problem I stuck in serious problem I m new in this field so please please help me and guide me with code snippet or fiddle

many thank's in advance.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

Let me give a snippet of code that i use

function updateAutoSrch()
 {
          $("#searchpro").autocomplete({
            source: function( request, response ) {
            $.ajax({
            url: "search",
            data: {proname: proname},
            dataType: "json",
            success: function( data ) {
            response( $.map( data, function( item ) {
                   return {
                       label: item.user_name,
                       value: item.user_name,
                       userid: item.user_id,
                       profile_image_path: item.profile_image_path
                   }
               }));
            }

            });
       }
  }).data("ui-autocomplete")._renderItem = function (ul, item) {
             var inner_html = "<a href='"+siteurl+"/user/"+item.userid+"'>"+ "</a>";
             return $("<li style = 'padding:20px 0 0 0;margin: 0 0 0 0;height:50px;' ></li>")
                     .data("item.autocomplete", item)
                     .append(inner_html)
                     .appendTo(ul);
         };
 }

using .data("ui-autocomplete")._renderItem we are modifying the default functionality of the autoload in jquery ui. item contains all the objects that are returned by success callback


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...