Self closing popup window is a web page which open in popup and close automatically after serving its purpose. It may be an HTML form which will be closed after successful submission of data. Or it may be an information window which will be closed automatically after a time delay say 10 seconds. In my opinion it is best practice to allow some time delay before self closing window and giving user a link such that he can close it manually.
A popup window can be created with the following JavaScript command,
<script type="text/javascript">
<!--
function popup(){
window.open('popup.php','mypopup','width=300,height=350,toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,copyhistory=yes');}
-->
</script>
This function will open a popup window of width =300px and height = 350px. URL of this popup window is popup.php. Please add this JavaScript code between
and tags from where you want to open this popup window. Now put a link <a href="javascript:popup()">Click here to open popup window</a>.Algorithm of PHP code in popup.php page is as follows:
Check whether user POST data or not.
If user POST data: display an HTML link to close this window. If user does not close it, window will be automatically closed after 5 seconds.
If POST data is empty: display an HTML submit form to accept user data.
<html>
<head>
<script type="text/javascript">
<!--
<?php
if(isset($_POST['name'])&&($_POST['name']!='')){
$name=htmlspecialchars($_POST['name']);
// Display self closing page.
?>
setTimeout("window.close();",5000);
-->
</script>
</head>
<body>
<p>Hello <?php echo $name; ?>!, <a href="javascript:window.close()">Click here</a> to close this window.</p>
<?php
// Display HTML form.
}else{ ?>
function validate(obj){
var l=obj.name.value.length;
if((l>10)||(l<3)){
alert('Message length between 3 to 10 characters.');
return false;}
return true;
}
-->
</script>
</head><body>
<form method="post" action="popup.php" onsubmit="return validate(this)">
Your name: <input type="text" name="name" /><br />
<input type="submit" name="submit" value="submit" />
<?php } ?>
</body>
</html>