JQuery Autocomplete hidden field

Question

Hello,

I received help on the first part of my problem here whoever I forgot to mention my second issue. After a user selects a value from the autocomplete field I would like to populate the vaules ID into a hidden field so it can be passed to PHP and inserted into a database.

Here is a breakdown of what I am trying to accomplish:

1. User selects venue from autocomplete field.
2. After the venue has been selected, the venues phone, address and website are display under the autocomplete field. The ID of the record in the database is passed to a hidden field as its value.

I have search but found nothing. Can someone lead me in the right direction?

Thanks

Answer 1

I'm assuming you're using the standard autocomplete plugin: http://docs.jquery.com/Plugins/Autocomplete

If you have this in your html:

<input type='text' id='foo' />
<input type='hidden' id='bar' />

You will want to use this as your javascript:

$(document).ready(
function(){
    var data = "1,address 1,phone 1|2,address 2,phone 2".split('|');
    $("#foo").autocomplete(data,{formatItem:function(item){
        return item[0].split(',').slice(1).join(' ');}
    }).result(function(event,item){
        $("#bar").val(item[0].split(',')[0]);
    });
});

What you're doing is this:

1. Adding a formatItem option to take out the id from your source data.
2. Adding a result handler to set your hidden field with the id.

Let me know if this helps.