Integracja obrazu z jQuery AutoComplete

Question

, więc pracuję nad tym projektem, w którym używam autouzupełniania jQuery do wyświetlania wyników wyszukiwania z bazy danych mysql. Wyniki wyszukiwania to nazwy produktów pobrane z bazy danych zawierającej również obrazy produktów. Jak mogę wyświetlić obrazy produktów, jak na poniższym obrazku?

Oto mój jQuery auto kompletne strony:

<script> 
$("#birds").autocomplete({ 
     source: "search.php", 
     minLength: 2, 
     select: function(event, ui) { 


     log(ui.item ? "Selected: " + ui.item.value + " aka " + ui.item.label : 
      "Nothing selected, input was " + this.actor); 
     window.location.href = './products/' + ui.item.productid; 
     //window.location.href = 'product_display.php?id=' + ui.item.value; 
     // document.testForm.action = "pretravel.php?id="+ui.item.value; 
     //document.testForm.submit(); 
     } 
    }); 
    }); 
</script> 

search.php

<?php 
include 'dbconnector.php'; 

// Sanitise GET var 
if(isset($_GET['term'])) 
{ 
$term = mysql_real_escape_string($_GET['term']); 
// Add WHERE clause 
//$term="Apple"; 
$query = "SELECT `productid`, `productname` FROM `products` WHERE `productname` LIKE '%".$term."%' ORDER BY `productid`"; 


$result = mysql_query($query,$db) or die (mysql_error($db)); 
$id=0; 
$return=array(); 
while($row = mysql_fetch_array($result)){ 

    //array_push($return,array('label'=>$row['productid'],'actor'=>$row['productname'])); 
    //array_push($return,array('value'=>$row['productid'],'label'=>$row['productname'])); 
    //array_push($return,array('actor'=>$row['productname'],'label'=>$row['productid'])); 
    array_push($return,array('productid'=>$row['productid'],'label'=>$row['productname'])); 

} 

header('Content-type: application/json'); 
echo json_encode($return); 
//var_dump($return); 

exit(); // AJAX call, we don't want anything carrying on here 
} 
else 
{ 
    header('Location:index'); 
} 

?> 

Answer 1

Jest to metoda zwana _renderItem Że chcesz użyć.

Oto mały demo to w użytku: http://jsbin.com/cunuxaqe/2/edit