Autocomplete: Render items as text, not HTML. Fixes #5275 - suggestions are not html-encoded.

As noted in the ticket, it's probably better to default to unstyled items to prevent problems. Users can still implement their own rendering method as shown in the custom data and display demo.

Author: scottgonzalez

demos/autocomplete/combobox.html

@@ -54,6 +54,12 @@
 						minLength: 0
 					})
 					.addClass("ui-widget ui-widget-content ui-corner-left");
+				input.data("autocomplete")._renderItem = function( ul, item) {
+					return $( "<li></li>" )
+						.data( "item.autocomplete", item )
+						.append( "<a>" + item.label + "</a>" )
+						.appendTo( ul );
+				};
 				$("<button>&nbsp;</button>")
 				.attr("tabIndex", -1)
 				.attr("title", "Show All Items")

demos/autocomplete/search.php

@@ -3,8 +3,8 @@
 $q = strtolower($_GET["term"]);
 if (!$q) return;
 $items = array(
-"Great <em>Bittern</em>"=>"Botaurus stellaris",
-"Little <em>Grebe</em>"=>"Tachybaptus ruficollis",
+"Great Bittern"=>"Botaurus stellaris",
+"Little Grebe"=>"Tachybaptus ruficollis",
 "Black-necked Grebe"=>"Podiceps nigricollis",
 "Little Bittern"=>"Ixobrychus minutus",
 "Black-crowned Night Heron"=>"Nycticorax nycticorax",

ui/jquery.ui.autocomplete.js

@@ -304,7 +304,7 @@ $.widget( "ui.autocomplete", {
 	_renderItem: function( ul, item) {
 		return $( "<li></li>" )
 			.data( "item.autocomplete", item )
-			.append( "<a>" + item.label + "</a>" )
+			.append( $( "<a></a>" ).text( item.label ) )
 			.appendTo( ul );
 	},