jQuery - passing value from one input to another

Question

I have a form, with several input fields that are title, name, address etc

What I want to do, is to get these values and 'put them' into values of other input fields. For example

<label for="first_name">First Name</label> <input type="text" name="name" />  <label for="surname">Surname</label> <input type="text" name="surname" />  <label for="firstname">Firstname</label> <input type="text" name="firstname" disabled="disabled" /> 

So If I enter John in the first_name field, then the value of firstname will also be John.

Many thanks

Answer 1

Assuming you can put ID's on the inputs:

$('#name').change(function() {     $('#firstname').val($(this).val()); }); 

JSFiddle Example

Otherwise you'll have to select using the names:

$('input[name="name"]').change(function() {     $('input[name="firstname"]').val($(this).val()); }); 

Answer 2

It's simpler if you modify your HTML a little bit:

<label for="first_name">First Name</label> <input type="text" id="name" name="name" />  <label for="surname">Surname</label> <input type="text" id="surname" name="surname" />  <label for="firstname">Firstname</label> <input type="text" id="firstname" name="firstname" disabled="disabled" /> 

then it's relatively simple

$(document).ready(function() {      $('#name').change(function() {       $('#firstname').val($('#name').val());     }); });