I have a two-step login form. In the first step, I have "username" as "id" and "name" of the text input. I also have "password" as id and "name" of the second input field, where the user is prompted to enter username and password.

In the second step, I have "confirmusername" as "id" and "name" of the text input. I also have "confirmpassword" as "id" and "name" of the text input.

I want the the value of the "username" entered in the first step to become the value of "confirmusername".

Your help would be much appreciated. Thanks in advance.

The following is my code:

<!DOCTYPE html>
<meta charset="UTF-8">
form#multiphase{ border:#000 1px solid; padding:24px; width:350px; }
form#multiphase > #show_all_data{ display:none; }
var username, password, confirmusername, confirmpassword;
function _(x){
    return document.getElementById(x);
function processPhase1(){
    username = _("username").value;
    password = _("password").value;
    if(username.length > 2){
        _("display_username").innerHTML = username;
        _("display_password").innerHTML = password;
        _("phase1").style.display = "none";
        _("show_all_data").style.display = "block";
function submitForm(){        
    confirmusername = _("confirmusername").value;
    confirmpassword = _("confirmpassword").value;
    if(confirmpassword.length > 0){
        _("multiphase").method = "post";
        _("multiphase").action = "";

<form id="multiphase" onsubmit="return false">
  <div id="phase1">
    Username: <input id="username" name="username"><br>
    Password: <input id="password" name="password"> <br>
    <button  id="next" onclick="processPhase1()">Next</button>
  <div id="show_all_data">
    Username: <span id="display_username"></span> <br>
    Password: <span id="display_password"></span> <br>
    Confirm Username: <input id="confirmusername" name="confirmusername" value=""><br>
    Confirm Password: <input id="confirmpassword" name="confirmpassword"> <br>
    <button onclick="send()">Send</button>

var input = document.getElementById("username");
var input = document.getElementById("password");
input.addEventListener("keypress", function(event) {
  if (event.key === "Enter") {
var input = document.getElementById("confirmusername");
var input = document.getElementById("confirmpassword");
input.addEventListener("keypress", function(event) {
  if (event.key === "Enter") {

I've resolved the issue.

So sorry I couldn’t help. I was still sleeping when you posted.

commented: Thanks, Dani for stopping by. I managed to figure it out by myself. I reiterate my appreciations for your time. +5
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.