Coding a popup box with more than 1 input in JavaScript

It is extremely simple to code a popup box with more than 1 input in JavaScript. Here is the code snippet for your reference. (Run Code)

var mywindow = window.open("", "_blank", "width=400, height=200");

mywindow.moveTo(450, 50);

function ok() {
var name = mywindow.document.getElementById('name').value;
var pass = mywindow.document.getElementById('pass').value;
mywindow.close();
alert('Name: ' + name + ' Password: ' + pass);
}

function cancel() {
mywindow.close();
}

mywindow.document.open();

mywindow.document.write("<html>
<head>
<title>Popup Box with 2 inputs | 10xCoderKids</title>
</head>
<body>
<p>Please enter your details:</p>
Name: <input id='name' /><br><br>
Password: <input id='pass' /><br><br>
<button id='submit'>Ok</button>
<button id='cancel'>Cancel</button>
</body>
</html>");

mywindow.document.getElementById('submit').addEventListener('click',function(){
ok();
})

mywindow.document.getElementById('cancel').addEventListener('click',function(){
cancel();
})

mywindow.document.close();

1 comment:

  1. I must thank you for the efforts you’ve put in penning this blog. I’m hoping to view the same high-grade content by you later on as well. In truth, your creative writing abilities have inspired me to get my own blog now
    Best Coding Classes Near me

    ReplyDelete

Coding for Kids

What is coding? In coding we build a program to do a specific task for us. Code: A code is a set of computer instructions and when you will ...