For many applications of PHP, the ability to interact with users
who view the Web page is essential. Veterans of JavaScript tend
to think in terms of event handlers, which let you react directly
to the actions of the user - for example, the movement of the
mouse over a link on the page. Server-side scripting languages
such as PHP have a more limited scope when it comes to user
interaction. As PHP code is activated when a page is requested
from the server, user interaction can only occur in a back-and-
forth fashion: the user sends requests to the server, and the
server replies with dynamically generated pages.
The key to creating interactivity with PHP is to understand the
techniques we can use to send information about a users'
interaction along with their request for a new Web page. PHP
makes this fairly easy, as we'll now see.
The simplest method we can use to send information along with a
page request uses the URL query string. If you've ever
seen a URL with a question mark following the filename, you've
witnessed this technique in use. Let's look at an easy example.
Create a regular HTML file called welcome.html (no
.php file extension is required, since there will be
no PHP code in this file) and insert this link:
<a href="welcome.php?name=Kevin"> Hi, I'm Kevin! </a>
This is a link to a file called welcome.php, but as
well as linking to the file, we're also passing a variable along
with the page request. The variable is passed as part of the
"query string", which is the portion of the URL that follows the
question mark. The variable is called name and its
value is Kevin. To restate, we have created a link
that loads welcome.php, and informs the PHP code
contained in the file that name equals Kevin.
To really understand the results of this, we need to look at
welcome.php. Create it as a new HTML file, but this
time note the .php extension -- this tells the Web
server that it can expect to interpret some PHP code in the file.
If your Web server is not configured to accept .php
as a file extension for PHP files, you may have to call it
welcome.php3 instead (in which case you'll also want
to adjust the link above accordingly). In the body of this new
file, type:
<?php
echo( "Welcome to our Web site, $name!" );
?>
Now, if you use the link in the first file to load this second
file, you'll see that the page says "Welcome to our Web site,
Kevin!" The value of the variable passed in the query string of
the URL was automatically placed into a PHP variable called
$name, which we used to display the value passed as
part of a text string.
You can pass more than one value in the query string if you want
to. Let's look at a slightly more complex version of the same
example. Change the link in the HTML file to read as follows
(this is welcome2.html in the code archive):
<a href="welcome.php?firstname=Kevin&lastname=Yank">
Hi, I'm Kevin Yank! </a>
This time, we'll pass two variables: firstname and
lastname. The variables are separated in the query
string by an ampersand (&). You can pass even
more variables by separating each name=value pair
from the next with an ampersand.
As before, we can use the two variable values in our
welcome.php file (this is welcome2.php
in the code archive):
<?php
echo( "Welcome to our Web site, $firstname $lastname!" );
?>
This is all well and good, but we still have yet to achieve our
goal of true user interaction, where the user can actually enter
arbitrary information and have it processed by PHP. To continue
with our example of a personalized welcome message, we'd like to
allow the user to actually type his or her name and have it
appear in the message. To allow the user to type in a value,
we'll need to use an HTML form.
Here's the code (welcome3.html):
<form action="welcome.php" method="get">
First Name: <input type="text" name="firstname" /><br />
Last Name: <input type="text" name="lastname" /><br />
<input type="submit" value="GO" />
</form>
Don't be alarmed at the slashes that appear in some of these tags
(e.g. <br />). The new XHTML standard for
coding Web pages, calls for these in any tag that does not have a
closing tag, which includes <input> and
<br> tags, among others. Current browsers do
not require you to use the slashes, of course, but for the sake
of standards-compliance, the HTML code in this series will
observe this recommendation. Feel free to leave the slashes out
if you prefer (I agree that they're not especially nice to look
at).
This form has the exact same effect as the second link we looked
at (with firstname=Kevin&lastname=Yank in the
query string), except that you can enter whatever names you like.
When you click the submit button (which has a label of "GO"), the
browser will load welcome.php and automatically add
the variables and their values to the query string for you. It
retrieves the names of the variables from the name attributes of
the input type="text" tags, and it obtains the
values from the information the user typed into the text fields.
The method attribute of the form tag is used to tell the browser
how to send the variables and their values along with the
request. A value of get (as used above) causes them to be passed
in the query string, but there is an alternative. It's not always
desirable -- or even technically feasible -- to have the values
appear in the query string. What if we included a
<textarea> tag in the form, to let the user
enter a large amount of text? A URL that contained several
paragraphs of text in the query string would be ridiculously
long, and would exceed by far the maximum length of the URL in
today's browsers. The alternative is for the browser to pass the
information invisibly, behind the scenes. The code for this looks
exactly the same, but where we set the form method to get in the
last example, here we set it to post
(welcome4.html):
<form action="welcome.php" method="post">
First Name: <input type="text" name="firstname" /><br />
Last Name: <input type="text" name="lastname" /><br />
<input type="submit" value="GO" />
</form>
This form is functionally identical to the previous one. The only
difference is that the URL of the page that's loaded when the
user clicks the "GO" button will not have a query string. On the
one hand, this lets you include large values, or sensitive values
(like passwords) in the data that's submitted by the form,
without their appearing in the query string. On the other hand,
if the user bookmarks the page that results from their submission
of the form, that bookmark will be useless, as it doesn't contain
the submitted values. This, incidentally, is the main reason that
search engines like AltaVista use the query string to submit
search terms. If you bookmark a search results page on AltaVista,
you can use that bookmark to perform the same search again later,
because the search terms are contained in the URL.
That covers the basics of using forms to produce rudimentary user
interaction with PHP. We'll cover more advanced issues and
techniques in later examples.
» 
Comment and Contribute
