Under the Hood: The Popup From a Form Script
In this page we'll look at the technical details of how to open a popup for the results of a form. If you just want to quickly implement a popup for a form you probably will do better starting with Popup Windows: From a Form
First let's look at the script used to open a popup from a form.
This script is a little different than the script we've used in most of our other examples. The main difference is that with a link we open the popup with the link's URL, then cancel the
onClick event. With forms we open a blank popup, target the form at the popup, and we don't cancel the
Line 1 begins the script element and line 2 begins the comment that should surround every script.
Line 3 begins the
popupform() takes two arguments. The first argument,
myform, refers to the form itself. The second argument,
windowname, sets a unique name for the popup window.
Line 4 has the opening bracket for the
popupform() function. Line 5 tests for the
window.focus method which is required to bring the popup to the front every time.
Line 6 opens the popup. Notice that we don't give the popup
a URL. When the popup opens it's blank.
Line 7 sets the
target property of the form to the name of the popup, so when the form opens it targets the popup instead of the current page.
8 returns true. Technically this line isn't needed because in the
onSubmit attribute we don't use
return. However, it's easy to forget and put a return statement in... 8 makes the script a little more fault tolerant.
Line 9 closes the function, 10 closes the comment, and 11 closes the script.