Categories
autocomplete forms html jquery-ui

Jquery UI Autocomplete – Selected result to DIV rather than form field

I wonder if somebody would be kind enough to help me with my query?

I have the following code that works great, however I would like to post one of the selected results to a DIV rather than a form field.

I’ve tried 101 things myself but the solution is beyond me.

I also thought that making the form field hidden and copying the contents into the DIV with Javascript would be a solution until I realized that I did not know how to do that either…

$( "#search" ).catcomplete({
delay: 0,
source: 'complete_client.php',
minLength: 2,
select: function( event, ui ) {
$( "#id" ).val( ui.item.id );
$( "#title" ).val( ui.item.value );
$( "#spec" ).val( ui.item.spec );
document.forms["main_search"].submit();
}
});

I would, where possible like the id to remain in the form field with the title and the spec to populate a DIV.

Should it not be possible/too much work, would automatically copying the form contents into a DIV be possible/easier with Javascript?

Many thanks in advance

Chris

$( "#search" ).catcomplete({
delay: 0,
source: 'complete_client.php',
minLength: 2,
select: function( event, ui ) {
// Put selected item's text into div
$('#divid').text(ui.item.value);
/* Whatever other code you want here */
}
});