Popup window using input text and onclick button

Question

I'm looking for the solution : opening the Popup window by inserting a value for example.

if your site is: www.example.com/ by inserting a value as a text let's take ' results ' and clicking on the button show us this Popup page: www.example.com/results

actually I'm using this Code, but that shows the result in the same page

<!DOCTYPE html> 
<html> 
<head> 
	<title>Redirect url in Javascript</title> 
</head> 
<body> 
<input id = "url" type = "text" name = "url"
						placeholder = "Enter a url here"> 
<input type = "submit" name = "button" onclick = "fun()"> 
<script> 
function fun() { 
	var url= document.getElementById("url").value; 
	document.write("Redirecting to the url in 3 seconds..."); 
	setTimeout(function(){window.location = url;}, 3000); 
} 




</script> 
</body> 
</html>

You want to redirect to www.example.com/results on button click. — Vikas Gupta
– Vikas Gupta, Commented Apr 12, 2020 at 20:03
What kind of pop-up window are you particularly looking for? Is the browser supposed to (a) open a new tab? Or (b) a true modal(?) pop-up window? Or (c) a HTML overlay that's supposed to look like a pop-up window? — AxD
– AxD, Commented Apr 12, 2020 at 20:03
Yes after input results and clicking on the button to redirect to www.example.com/results but it should open in pop-up, not in the same window cse_vikashgupta — Mousbir Zouhaïr
– Mousbir Zouhaïr, Commented Apr 12, 2020 at 20:06

Vikas Gupta · Accepted Answer · 2020-04-12 20:15:44Z

1

You will need to window.open(url) with an extra parameter like below.

function fun() { 
    var url= document.getElementById("url").value; 
    document.write("Redirecting to the url in 3 seconds..."); 
    var currentUrl = window.location.url;
    setTimeout(function(){    window.open(currentUrl+"/"+url, '_blank', 'location=yes,height=500,width=1000,scrollbars=yes,status=yes')}, 3000); 
}

Third Param describe how your new window would look like.(For ex. it's height and width) For more info Read Article

Search for Window features in Article.

edited Apr 12, 2020 at 20:15

answered Apr 12, 2020 at 20:10

Vikas Gupta

1,2311 gold badge12 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

mohammadtz55 · Accepted Answer · 2020-04-12 20:04:12Z

0

you should use window.open(url) and you can use `` or "" with + to create the url that you want

answered Apr 12, 2020 at 20:04

mohammadtz55

1312 silver badges13 bronze badges

3 Comments

Mousbir Zouhaïr Over a year ago

I tried it but that doesn't show the pop-up in a new window

mohammadtz55 Over a year ago

although it worked for me but if you add _blank as a second parameter it will open in a new tab

mohammadtz55 Over a year ago

setTimeout(function(){window.open("https://" + url,"_blank");}, 3000); }

DCR · Accepted Answer · 2020-04-12 20:13:40Z

0

two issues with your code:

1) you need to include https:// in the url 2) on js fiddle and stackoverflow you can only test their domain

so if you enter www.stackoverflow.com you'll see that the code below works as intended

<!DOCTYPE html> 
<html> 
<head> 
	<title>Redirect url in Javascript</title> 
</head> 
<body> 
<input id = "url" type = "text" name = "url"
						placeholder = "Enter a url here"> 
<input type = "submit" name = "button" onclick = "fun()"> 
<script> 
function fun() { 
	var url= document.getElementById("url").value; 
	document.write("Redirecting to the url in 3 seconds..."); 
	setTimeout(function(){window.location = "https://" + url;}, 3000); 
} 




</script> 
</body> 
</html>

answered Apr 12, 2020 at 20:13

DCR

15.8k13 gold badges61 silver badges131 bronze badges

Collectives™ on Stack Overflow

Popup window using input text and onclick button

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related