I am currently using the DevBridge jQuery Autocomplete plugin - it works fine as is, however I would like to display the returned information in a multi-column view, but yet when clicked only return the first value.
HTML
<form class="form" action="index.php" onsubmit="alert('Submit Form Event'); return false;">
<div id="selection"></div>
<input type="text" name="q" id="query" class="textbox" />
</form>
Javascript
jQuery(function() {
var options = {
serviceUrl: '/autocompleterequestcall.php',
maxHeight:400,
width:600,
fnFormatResult: fnFormatResult,
deferRequestBy: 0 //miliseconds
};
a1 = $('#query').autocomplete(options);
});
So I expect I would need to use the fnFormatResult to somehow display the multicolumn values, which are separated by |, ie.
REFERENCEID | POSTCODE | ADDRESS_LINE_1 | SURNAME
I would have liked to wrap the whole return up as a <table> but I can't figure out where to put the start <table> and end </table> tags, or do I just replace | with </div><div>.
Then, when an item is selected, instead of returning
REFERENCEID | POSTCODE | ADDRESS_LINE_1 | SURNAME
I would just like to see
REFERENCEID
