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)

4 
$("<li>")

This is not how you select list elements.

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

6

When I write:

<ul>
  <li></li>
  <li></li>
</ul>

and use:

$("<li>").text("List text")

the text List text does not display for the 2 list elements. However, if I write the selector as it normally would be written in JS, it works.

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>"))

8

I get:
image

Taking off the < and > gets me:

image

I think I am missing what you are trying to explain to me. Are you saying $("<li>") creates an element? I think I understand now what I am seeing in the console. Very interesting. I did not know that about jQuery.

9

jQuery is like the kitchen sink of convenient syntaxes.