CODEWITHSUNDEEP
jqueryimageautocompleteinputjquery-autocomplete
user256410
user256410

Reputation: 1015

How might I cause jQuery Autocomplete to display results with images, and no PHP?

I am implementing jQuery Autocomplete and wish to display results with an associated image. Each image has the same name as the predicted result of the autocomplete field. i.e. If someone types "braz" then "brazil" appears with brazil.jpg inline beside it. I'm having trouble implementing this.

If anyone can point me in the right direction I'd appreciate it. By the way, I'm using Jorn's version.

Am also interested in using smaller versions of autocomplete, but have only found Drew Wilson's and couldn't manage to work it at all.

Upvotes: 1

Views: 1711

Answers (1)

Joel
Joel

Reputation: 19368

Look at #suggest4 on this demo page. The formatItem and formatResult functions are used to make the result and the item appear different.

function formatItem(row) {
    return row[0] + " (<strong>id: " + row[1] + "</strong>)";
}
function formatResult(row) {
    return row[0].replace(/(<.+?>)/gi, '');
}

// apply the format functions using the options provided.
$("#country").autocomplete('getdata.jsp', { 
    formatItem: formatItem,
    formatResult: formatResult
};

Upvotes: 1

Related Questions