Search code examples
javascriptjquerytextinput

echo value from 1 input box into another with jQuery

I have an AJAX powered form which is more like a 5 step wizard. There are no page refreshes until the data is submitted at the very end.

On an earlier step a value is entered into a HTML text field and I would like to have those same values present in another text box on the last page as they review the final details of their submission before they hit send..

I think it needs to be done with an onChange event but I cannot seem to get it to work fully, I am a PHP developer so am still working on my jQuery skills. Here is the code I wrote with no success:

<script type="text/javascript">
$(document).ready(function() {
$("#textbox1").change(function()
        {
    var text = $("#textbox1").val(); 
    $("#textbox2").html(text);
        }); 
});
</script>

Thanks in advance gents.

Solution

  • .val is used for both getting and setting a input's value:

    • .val() returns the value
    • .val(something) sets the value

    So:

    $("#textbox2").val(text);

    .html is used to get/set an element's HTML contents, but for input elements that does not make sense. The following is bogus (which is what .html is trying):

    <input>some html</input>