Why does HTML does not work in Jquery Autocomplete?

JavaScript
1

Hi so the results how fine but i am trying to append an image on the left side of the title but it just shows up as an html text. please help

js code
js code999×588 47.1 KB

Image Of Search Output Below:

My Search Results

2

Autocomplete Widget | jQuery UI API Documentation

Independent of the variant you use, the label is always treated as text. If you want the label to be treated as html you can use Scott González’ html extension. The demos all focus on different variations of the source option - look for one that matches your use case, and check out the code.

1 Like
3

so i tried the changes you suggested, but the li tag shows empty as it dropdowns

but the console log is working well (as i get the items in the success function)

5

I’m sure it is just some jQuery shorthand. It is creating the element as far as I can tell.

<ul></ul>

$("<li>").text("List text").appendTo("ul");

I think you either have to add the script after jQuery and jQuery-UI or chain the _renderItem function on the autocomplete return.

$( "#search-input" )
  .autocomplete({ // your code })
  .data("ui-autocomplete")._renderItem = function (ul, item) { 
    // your code
  }

This one seems to be extending $.widget

7

I would imagine that is because it isn’t a selector. It is creating the element. You have to append the element to the DOM.

console.log($("<li>"))

9

jQuery is like the kitchen sink of convenient syntaxes.

10

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.