Assigning value of one text box to another

jquery input textbox

14,684

Solution 1

You're not waiting for the DOM to become ready. You should write something like:

$(document).ready(function() {
    $("#button").click(function() {
        var contents = $("#textbox").val();
        $("#container").val(contents);
    });
});

Solution 2

Your code looks good. Just add it to the $(document).ready(...) event handler like this:

$(document).ready(function() {
    $("#button").click(function() {
        var contents = $("#textbox").val();
        $("#container").val(contents);
    });
});

You could also simplify your code a bit:

$(document).ready(function() {
    $("#button").click(function() {
        $("#container").val($("#textbox").val());
    });
});

Take a look at the .ready() docs.

Solution 3

You should wait for all elements with document.ready event, and you can simplify your jquery:

$(document).ready(function() {
    $("#button").click(function() {
        $("#container").val($("#textbox").val());
    });
});

14,684

Author by

dbr

Updated on June 26, 2022

Comments

dbr almost 2 years

Have looked at the answers to similar questions to this, but for the life of me, I can't figure out what I'm doing wrong.

I have a two text boxes and a button. When text is added to the first textbox and the button pressed, I want to apply the first textbox's value/text to the second textbox:

<html>
<head>
    <script type="text/javascript" src="jquery.js"></script>
    <script>
        $("#button").click(function() {
            var contents = $("#textbox").val();
            $("#container").val(contents);
        });
    </script>
</head>
<body>
    <input type="text" id="textbox" /> <input type="submit" id="button" value="Press This" />
    <br />
    <input type="text" id="container" />
</body>
</html>