List /View
Many web applications are all about data. We store our data in a database management system, and build the web application to allow access to that data. Our first step towards building a web application starts with the concept of the list and the view.
So Much Data, So Little Space
When we view data on the web, we need a way to present a reasonable amount of data, even if there are thousands of things we could show. When I go to amazon.com, I don't see all of the millions of books at once. I might see a select list of books, and when I select one of them, I can then view the details of a single book. The terms list & view are borrowed from the Rails web development platform. Until Rails came along, I called the these category & item, respectively.
The List
We address the list first, because this is the way we present the user with choices. An easy way to imagine a list is to think of what is returned when we do a search on a search engine. We see a list of items, with a description that gives us enough detail to determine if we are interested. If we wish to view the details of an item, we click on a link which will take us to the view page.
Loaded Querystring
When we looked at forms, we may have noticed that using the GET method appends the data submitted via the form to the end of the formhandler page:
formhandler.php?id=5
While it is not advised to use the GET method for forms, it is highly useful to use GET to append data via the querystring in a link. We call a link to a page with data embedded in the querystring a loaded querystring.
When we build a list out of the database, we loop through our records, and can create links to each individual item. Although we create several links, we only need to create one page to receive all the links. This is our view page.
The View
We create a single page (the view) and design it to accommodate any number of different 'like' items. For example, it is the view we see for a single book on Amazon. The individual page is one page, but the data that is swapped out varies because we switch to a different record in the database. To do this, we need the unique ID number of the record.
The ID Number On The Querystring
We can use our single view page to accomodate any number of different items. Typically the item is identified by the unique ID number of the individual record, since it is the single unique identifying piece. That id number is appended to the name of our view page:
view.php?id=5
Then, we can construct a link to this item, which when viewed via the HTML source, would look like this:
<a href="view.php?id=5">My PHP Book</a>
In the above example, My PHP Book is the title of the page. Both the ID number and the title of the book are retrieved from the database. The line of PHP/MySQL code could look like this:
print '<a href="view.php?id=' . row['BookID'] . '">' . row['BookTitle'] . '</a>';
List as Entry Point of the Web Application
The list and view pages together make a simple web application. We'll call the list page the entry point of the application, because the view pages are loaded by visiting the list page first. How can you view a single item on the view page, without loading the querystring? This is why the list is the entry point.
Muffins as Context
To give this demo a specific context, we’ll use the theme of ‘muffins’ as our type of data. This demo could apply to any other sort of item, such as books, CDs, images or clothing.
Database Tables
In order to store our muffins, we'll need to build a database table to hold the proper data types and then enter some test data. In our case, we'll create a table named tblMuffins, and insert 6 test muffins:
create table tblMuffins
( MuffinID int unsigned not null auto_increment primary key,
MuffinName varchar(60),
Description text,
Price decimal(5,2)
);
insert into tblMuffins values (NULL,"Apple","An apple muffin a day keeps the doctor away!",.99);
insert into tblMuffins values (NULL,"Banana Nut","Bananas and walnuts combine in a rich and rewarding muffin!",1.50);
insert into tblMuffins values (NULL,"Blueberry","Our wildly popular traditional blueberry muffin.",1.25);
insert into tblMuffins values (NULL,"Chocolate","The chocoholics love us for this one!",1.50);
insert into tblMuffins values (NULL,"Bran","Our bran muffins are a favorite among our regular customers!",.99);
insert into tblMuffins values (NULL,"Raspberry","A truly decadent raspberry streusel muffin!",1.99);
You can copy the SQL script above and paste it into the command line on MySQL, or you can install a program like
phpMinAdmin. which can make your MySQL configuration life easier!
model_list.php/model_view.php
The following example shows how 2 visible pages interact to create a fundamental web application. It is an application because the pages work together with data to present a dynamic set of data. The application consists of more than one file, so it is a multi-file web application.
We've named our demo model instead of muffins to highlight the reason for the pages is really to create a model from which to make more pages. If we made a list/view application to feature CDs, for example, we could use cd_list.php & cd_view.php. With CDs being the reason for the application, the word "CDs" would be the name/label that a user sees when clicking on the link to our cd_list.php page:
<a href="cd_list.php?>My CDs</a>
In the above example, My PHP Book is the title of the page. Both the ID number and the title of the book are retrieved from the database. The line of PHP/MySQL code could look like this:
Contingency: The model_list.php example relies upon correct installation of nmCommon, a set of functional include files to handle errors and database credentials.
Redirection
During the course of building web applications we run into the issue of passing the users browser back and forth between pages. This could be due to a successful login, or even due to an unsuccessful login attempt! The concept of redirection exists in nearly every server side language. In our case, if invalid data is sent to our view page, we'll elect to redirect the user back to a safe page, in this case our list page.
myRedirect()
The function used in model_view.php to handle redirection is named myRedirect() and it's inside our common_inc.php include file of utility functions. We use this function to forcibly redirect a user who overtypes the querystring data being passed into model_view.php. PHP has a function named header() which can be used to redirect a user, but our version incorporates header() and can accept an absolute or relative URL, and also keeps either the HTTP or HTTPS protocol of the sending page intact.
dbOut()
common_inc.php also includes dbOut(), which is designed to ‘clean’ (sanitize) the string of data as it leaves the database, and enters our page. This function is called a wrapper, because it ‘wraps’ other functions that we can now change, as our site develops, or if we need special handling. Placing all the ‘cleaning’ code in a wrapper allows us to change this capability site wide.
dbOut() implements some built in PHP functions such as stripslashes(), which along with its opposite addslashes() render harmless single quotes, which trip up an insertion of data into a database. In SQL, single quotes are used to designate a string, but must be escaped (by adding a slash in front of the literal quote) to be entered into the database.
dbOut() has an opposite related function named dbIn() which employs mysql_real_escape_string() and other connection specific cleaning methods. More on that function later!