Question

I know this has been covered before, but i can’t find exactly what i need….

to put things short, i need to copy the selected option from a dropdown field to a text box. And i have this code to do it:

$(function(){
    $('#font').bind('change', function(){
        $('#input').val($(this).val());
    });
});​

BUT, the page loads with a pre-selected option in the drop-down field, which means that people don’t necessarily need to select an option. How can i get the field with id #input to show the option from the drop down menu #font even if the user does not engage and select a different option?

Miro

Answer 1

on page load

$(function(){
    //this first line loads the pre-selected value into the text box
    $('#input').val($('#font option:selected').val());
    //still want to bind the change event
    $('#font').bind('change', function(){
        $('#input').val($('#font option:selected').text());
    });
});

http://jsfiddle.net/Us8CG/5/

check out the fiddle, thanks to answer by @MetalFrog.