How does onchange carry selected text and hidden value?

I have a dynamically populated PHP dropdown menu that gathers the following information from the database:

echo '<option value="'.$image['id'].'">'.$image['description'].'</option>';

I then have a JavaScript function that shows the selected text – description in an input box for editing and then on submit update back into the database.

Question: Is there away using JavaScript that I could pass the id and description together but only have the description show in the input box for editing?

$('#captionSelect').change(function(){
        $('#captionInput').val($("#captionSelect option:selected").text()).show();
    });

Answer

you can try this.

$('#captionSelect').change(function(){
        $('#captionInput').val($("#captionSelect option:selected").html()).show();
    });

Thanks.