Populate 1 form field based on another

Question

Is there an easy way to populate one form field with duplicate content from another form field?

Maybe using jQuery or javascript?

Answer 1

You just have to assign the field values:

// plain JavaScript
var first = document.getElementById('firstFieldId'),
    second = document.getElementById('secondFieldId');

second.value = first.value;

// Using jQuery
$('#secondFieldId').val($('#firstFieldId').val());

And if you want to update the content of the second field live, you could use the change or keyup events to update the second field:

first.onkeyup = function () { // or first.onchange
  second.value = first.value;
};

With jQuery:

$('#firstFieldId').keyup(function () {
  $('#secondFieldId').val(this.value);
});

Check a simple example here.