Autocomplete renderItem: Can you also render input text and clickable buttons
We have an existing code that uses jQuery Autocomplete on one of our search functionality utilizing _renderItem to customize the label.
What I need is to also customize the rendered item to have an input field for quantity and a button for updating counts. Is there a way to utilize _renderItem for this functionality? Here is a sample screenshot of what I need to create:
I have tried customizing the .append() but it seems to always trigger the select action wherever I click even if the anchor tags are only for the image, hence I am unable to click on the input field and button:
return $("<li></li>") .data("item.autocomplete", item) .append("<table><tr> "+ "<td><a><img style=\"width:70px;\" src=" + item.imageUrl + "></a></td>" + "<td>" + item.desc + "<br>" + item.label + "</td>" + "<td><label>Qty:</label><input type=\"text\" maxlength=\"9\" size=\"6\"><button id=\"atcButton\" type=\"button\" class=\"primary\" onclick=\"\">Update Count</button></td>" + "</tr></table>") .appendTo(ul);