Question

Friends how can i do the following? I am having three input fields

 <input name="firstname" type="text" class="text" id="firstname" value="" />
 <input name="lastname" type="text" class="text" id="lastname" value="" />
 <input name="displayname" type="text" class="text" id="displayname" value="" />

I want to do this. After the user enters the first name and lastnaeme and then he clicks on the display name field, it should be populated with a value as “firstname lastname”, How can I do it javascript?

Answer 1

Add onclick or keypress events on the displayname element with function –

function populateDisplayName(){
    var firstName = document.getElementById('firstname');
    var lastName = document.getElementById('lastname');
    document.getElementById('displayname').value = firstName.value + ' ' + lastName.value;
}

Demo