Introduction to PHP Web Application Development

Hello again, and welcome back to Educator.com's Introduction to PHP course.0000

In today's lesson, we are going to be continuing development of our web application, incorporating what we learned in our last lesson about foreach loops.0004

We are going to go through three different versions of the web app today.0013

In version 14.0, we are going to be replacing all of the while loops that we have had in our application,0017

that iterate over arrays, with foreach loops, because that is what foreach loops are meant for.0023

And we will see how that makes it a little bit cleaner syntax.0028

In version 14.1, we are going to be adding a department page to our website, a department.php that is going to allow us to...0032

We are also going to create an array in our catalog.php file called departments that is going to associate different items with different departments explicitly.0042

And then, when you go to department.php, looking for different departments, it is going to list all of the items in that department.0052

So, we will see how that works.0057

In version 14.2, we are going to be adding to some of our pages a left navigation bar.0059

It is going to improve our app a little bit, because typically, when you go to a store and you look at item pages on the left-hand side,0065

you can see the departments listed; so we are going to add that feature to our application.0070

And that is going to make use of a foreach loop, as well as the other changes that we are going to be making.0074

In 14.0, we are simply going to be making some changes to calcCartTotal function and our isValidCart function0081

(which we updated in our last version of the web application).0092

And then, we are also going to update viewCart.php, which uses a while loop for outputting all of the different rows for each item in the shopping cart.0094

So, each of these three different functions and pages uses while loops, and we are just going to update them to use foreach loops,0105

because they are iterating over arrays; and that is to get practice with the foreach loop.0113

So, if we go and take a look at version 13.1, which is our last version of our web app, in viewCart.php,0120

we can see that we have a while function that iterates over the itemCatalog array and pulls out the key and the value from it.0129

What we are going to do is...this is basically what foreach loops are made for; so we are going to replace this while loop0137

that uses this each function and the list function with a simpler, cleaner-looking foreach loop.0143

So, in our new version, it is going to be replaced with this simple foreach loop,0149

where we pass the array itemCatalog (the array that we are going to loop over).0155

We are going to pull the key for each element in the item catalog and set current item ID equal to that key,0159

because in our item catalog, the keys are the item ID's.0170

Then, we are going to set the variable currItem to the value of the array elements in itemCatalog.0173

And what the values are: those are the associative arrays that have the item's information (like its name, its file extension, and its price, and so forth).0180

That is the only change we are making in this file; but it is just to update it to use a foreach loop.0188

Similarly, in utilLIB.php, we have a calcCartTotal function that uses a while loop to iterate over this cartItems associative array.0194

So, in our updated version, we are just going to replace it with a foreach loop.0205

And again, we are not going to use this list construct; we are not going to use the each function.0214

Basically, what we are going to do is: provided the foreach loop with the cartItems array, we are going to say,0221

"set the variable itemID to the value of the key of each element in the array."0227

And then, we are going to create a variable called itemQty, which we are going to set0233

to the value of each element in the array that we are going to loop over.0237

Because the key for the cartItems array is the item ID, and the value is the item quantity--that is why we have named these variables itemID and itemQty.0242

This will be set to the key; this will be set to the value.0252

That is our update to calcCartTotal.0254

Similarly, if we look down at isValidCart, we have a while loop down here.0257

And actually, in this one, we are just pulling the value out of the associative array cartItems.0266

And the value we are pulling is the item quantity; so in our new version, if we look down at isValidCart,0271

we can see we use the foreach loop, but in this case we are using the indexed array syntax.0279

And as mentioned in the last lesson, you can use the indexed array syntax on an associative array if you are just interested in the value.0286

So, when we iterate over cartItems, we are going to pull out the value of each element in that array on each iteration of the loop,0292

and we are going to store that value in the variable itemQty.0299

So, on each iteration of the loop, we are going to pull the item quantity for whatever element or item we are iterating over,0302

and then we are going to perform our test that we have set up to test0308

whether any of the items in the cartItems array have a quantity greater than 0.0312

That is basically the updates to isValidCart, viewCart.php, and calcCartTotal, making use of the cleaner-looking foreach loop, instead of the while loops.0318

And that is what we had just learned in our last lesson.0330

Those are the changes that we made for version 14.0.0335

In version 14.1, we are going to do things that get a little more complicated than these simple loop updates.0340

We are going to be explicitly adding departments to our store.0347

We are going to be creating an array in catalog.php called departments, and what that array is going to do is going to be similar to the itemCatalog array.0351

It is going to be a multidimensional associative array, and what it is going to do is:0363

the key of departments is going to be...we are going to assign each department an item ID.0367

And then, we are going to assign to that item ID an array that contains information about the name of the department and all of the items in the department.0373

Then, what we are going to do is create a page called department.php.0383

And department.php is going to be like item.php, in that we are going to provide it, by a GET query string, a department ID, which is set in this departments array.0387

And then, what department.php is going to be able to do is loop over the items contained in the departments array0400

for a particular department and output a listing of each item in that department.0410

And then, after we do that, we are going to update store.php, so that it's going to include links to these new department pages.0419

Let's go take a look, first, at our old catalog.php.0428

We had recently updated it so that it has 6 items in it; and this is our itemCatalog array containing 6 items.0431

Well, in our new version, 14.1, we have our itemCatalog array, which is the same as before,0437

except now we have created an array called departments.0444

And it is a multidimensional array; the key of the highest-dimension array is the department ID.0447

So here, we are creating three departments: one department has the ID 1; one has the ID 2; one has the ID 3.0457

To each of those keys, we are associating a value that is another array.0464

It is an associative array, containing two key/value pairs.0470

One is going to be a key that represents the name of the department; in this case, department 1 is going to be the apparel department.0474

Department 2 is going to be the electronics department; department 3 will be sporting goods.0481

Then, we are also adding a key to each department's array, the key items, which is going to have another array as part of it.0487

We actually have a three-dimensional array here, and then it goes three levels deep.0496

And this array is going to contain the item numbers of all the items that go in that department.0501

So, for the apparel department, for example, the name of the department is Apparel.0507

It has a department ID 1, and then it contains the items with item ID 1001 and 1004.0511

Let's take a look at the page we are going to be creating, called department.php.0520

And actually, let's go and take a look at it.0524

This, for example, is what the department page looks like for apparel.0531

As you can hopefully see at the top of the browser here, the link is department.php, with a question mark.0535

So, we are appending a query string; in this case, we are setting the query string...having the name department ID and setting it equal to 1.0541

In this case, we want to load the apparel department.0549

So, what this script is doing is going out to that departments array and using the itemCatalog array, as well,0552

to load all of the items that are in the apparel department, and then output a row for each one of them,0558

telling you that, in the apparel department, there is a 100% cotton t-shirt and a winter jacket.0564

Let's take a look at the details behind department.php.0570

It is very similar to item.php, because it's one PHP page that we are using to display multiple departments.0573

And we do that by providing it a department ID, which it can then use to look up all of the information and items in a particular department.0580

So, the first thing we do is test to see if an item ID was provided by the GET string.0589

And we call it currDeptID; if that is true, then what we are going to do is load up the current department from the departments array.0594

So, we are going to take this department ID (in the Apparel case, it's department ID 1), and what we are going to do is load the value0605

associated with that key; so, for key 1, it is going to be this array here,0613

which is an associative array with two key/value pairs: name and items.0617

That is going to be currDept; it is going to represent all of the information about the current department.0624

Then, what we are going to do is create a short variable for all of the items that are in a department.0629

We know that, in our department array for department 1, there are 2 key/value pairs.0634

And the second key/value pair is an array called items that contains all of the items that are in the department.0643

So, what we are going to do here is create this variable called currDeptItems,0649

and we are going to use this current department that we just loaded from the departments array.0655

And we are going to load the items array for that department, which is, again,0661

an indexed array listing all of the item ID's that correspond to items in that department.0666

Then, we form some of the same functions that we did before.0672

We are outputting, as the page title, the name of the department; and we can get that because0674

we have loaded the current department from the departments array, and it has a key/value pair with the key name.0680

So, we are going to output the name as the page title.0686

Then, we are going to go down in the HTML section for outputting a department.0690

At the top of the page, we are going to output the department's name; and you can see that here, it is Apparel.0694

We do that by accessing this currDept variable we have created in our global variable section at the top.0700

We output a header row for a table, and you can see that the table has two columns.0706

It has a column called items and a column called price; so this is a section just for that row.0710

And then, what we are going to do--similar to when we output the different rows for our viewCart.php:0716

we are going to use a foreach loop to loop over the array currDeptItems, which we defined at the top,0721

which contains the item numbers of all of the different items contained in that department.0728

And then, for each item, we are going to output a row that has a link to the item and the item's price.0735

So, what we are going to do is: currDeptItems is that array taken from the third level deep in the departments array0740

that contains the strings that have the ID's of all the items in a particular department.0750

So, when we loop over this array, we are going to pull the value out of it, and each value is going to be the ID string for a particular item.0756

Then, what we are going to do is access the item catalog, which contains information about all of the items.0764

And we are going to use this current item ID that we pulled out of the departments array for this particular department to pull out that item's information.0771

So, we are going to look up the item in the item catalog, and we are going to store it in a variable called currItem.0780

Then, all we are going to do is output a link to that items page.0784

And as you can see here, we are using the outputItemLink function;0789

so this is a perfect example where you can see how functions can be reused in multiple spots.0792

We have this one functionality that has output a nice link to an item's page that contains a small image and a text link that is the name of the item.0797

Now, we can use this both in viewCart...we have the same function being used as we do in the department page.0810

So, you can see already how the functions are able to be reused in multiple spots; and that is one of the many advantages of having functions.0817

So, we simply output the item link; and then, in the second column, we output the current item's price,0826

which we can pull directly from currItem, which we loaded from the catalog.0831

And so, that is how department.php works: you provide it with a department ID; it goes out and looks up all of the items in the department.0836

Then it goes out and fetches, from the item catalog, the information about each item, and then outputs a row for each item.0845

Additionally, we have added to the homepage: these were static links, but these weren't links before.0854

So, if we look at the last version, 14.0, we can see that we hadn't explicitly defined departments yet, so Apparel wasn't really a link.0858

Now, on our new store.php, there are links to the department pages.0867

And if you click on Electronics, for example, it will take you to the electronics department, which is department ID 2.0872

And if we go and look at store.php in version 14.1, we can see that, whereas before we had just output Apparel as plain text,0881

we are outputting a link to the department.php page for the department with deptID=1.0896

And then, we are going to be using, as the name of the link, the name of the department.0905

And we do that by looking up department #1 in the departments array in catalog.php,0910

and then pulling out the value associated with the name of that department.0916

So, in this case, that shows how we have Apparel here, Electronics here, and Sporting Goods here,0921

because if we look at catalog.php, those were the names provided0926

in this department array: we have Apparel, Electronics, and Sporting Goods.0930

In version 14.2, we are going to take things a little bit further and, now that we have this departments array,0939

add a left-hand navigation to some of the pages in our website, so that when you are on, for example, the item page,0946

instead of just seeing information about the item, you can also click on the left-hand side and maybe browse to a different department.0952

We are going to add the left-hand navigation (and this is just a preference) to store.php, item.php, and department.php.0958

Now, in your application, maybe you might not want to have that on your homepage, for example.0970

But for this web application, that is just what we decided to go ahead and do.0973

And that left navigation bar is going to link to all of the different departments in the store.0977

And if we go and look at version 14.2, we can see the homepage, and you can see that it has added this left-hand navigation bar here.0985

And so, we can click on Electronics to go to the electronics department.0996

And as we can see, on the electronics department page, the left-hand navigation bar is there.1000

Let's say we want to look at the DVD player: you can also see that, because this is item.php, and (as I mentioned)1004

we have decided to add the nav bar here, instead of just seeing information about the item (for example, in the last version,1011

we just saw that, and then if we wanted to browse to a different department, we would have to hit Back),1017

now we have added this left-hand navigation, which gives us a little more flexibility in navigating throughout the store.1022

So now, we want to go to the Sporting Goods department, for example: and you can see all of the items in the sporting goods department.1027

The way that we do that is: we are adding an optional section to header.phtml.1034

And if that optional section is enabled (and we are going to get to how that works in a second), then that navigation bar is output.1042

So, if we go and look at header.phtml for the last version, 14.1, it is the same as it has been for a couple of versions now.1048

And this is what it looks like; it outputs the head of the HTML page: it outputs the header row, and then it starts the main table, and then the content pane.1061

What we are doing here is: when we add this left navigation bar, we are going to be adding another column to this main table,1073

which gives you the structure of our website.1080

For example, on the old version (actually, let's look at...), here we have the main table, and it has one cell that contains all of the content.1083

And that corresponds to this content pane that we have defined in our previous version of header.phtml.1096

Well, in the new version, now we have divided this main table that would comprise this whole section into two cells.1103

One is going to be the left nav bar, and then one is going to be the content.1110

So, this is the left navigation pane (we are going to call it), and this is the content pane.1113

When we look at the new version of header.phtml, the beginning is all going to be the same, except that, when we enter the main table,1117

instead of just going straight to beginning the content pane, we have included an if statement, where we have chosen1127

to optionally include this additional table cell that is going to output that left nav bar.1136

And what you can see is: in the left nav bar, what it does is goes through and accesses the departments array in catalog.php.1144

And in that array, we know that the department ID's are the keys of that array; the values are arrays that contain information about the department.1154

So, we are going to pull the key and value out of the departments array for each department that we have in our store.1162

It is going to pull out the department ID and put it in the variable deptID, and it is going to pull out the array1169

containing information about the department in the dept variable.1173

And then, all we are going to do is output a link to department.php that uses the query string with deptID.1177

And then, as you know, for the outputLink function, the first parameter to it is a URL.1186

And then, the second parameter is the body of the link: in this case, we want the body of the link to just be the name of the department.1192

So, we are going to access this departments array in catalog.php, and we are going to pull out the name out of there and output that.1198

And so, what happens is: this foreach loop goes over every department that we have in our store, and it is going to output a link for it.1210

Again, let's say we wanted to add another department to our store.1218

Well, if we had hard-coded this, for example, and hard-coded each link for each department1221

in the left nav pane of header.phtml, every time we had a new department, we would have to go in1226

and add a new listing for each new department.1231

Now, all we do is: when we update our data (which is contained in the departments array in catalog.php),1236

it is going to automatically pull that information and dynamically generate a left navigation bar1241

that is going to list all of the departments that we have.1247

Now, if you will notice, up here, the way that this is enabled, or we decide whether it's to be added to a page, is using this if test condition.1251

What it does is: first, it tests if a boolean flag that we are going to define, called useLeftNav, has been defined previously in the file.1263

So, we know header.phtml is included in all of our HTML and all of our PHP files to output the beginning portion of the HTML of our page.1272

Well, because it is included, we can define variables before we have included that file.1283

So, if this variable useLeftNav has been previously defined, and it is true (and when you "AND" a variable, it is just pulling1288

the value of the variable and evaluating it as a boolean value, so useLeftNav is going to be true or false)--as long as useLeftNav is set,1299

AND it is true, then this is going to work.1306

Now, because this is kind of a review, we know that the AND operator is a short-circuit operator.1309

So, when we evaluate isset, if it returns false, it is not going to try to pull the value useLeftNav and find out what its value is,1316

because if you did that, you would get an undefined variable error.1325

So, because it is a short-circuit operator, if isset returns false, it is not even going to bother to try and do that; so the order of these two does matter.1329

Now, if we go look at how this is used within our pages, if we look at item.php, for example,1337

in item.php in version 14.1, this is what the beginning section looks like when we get ready to include the HTML header file.1353

Well, in 14.2, we have added a little section here where we have created a variable useLeftNav,1365

which is going to be tested for in our included HTML header file.1372

And here, we have set it to true: so, on every one of our pages where we want to include that left nav bar,1378

we simply set this flag and set it equal to true.1382

For the three pages that we include it on (item.php, department.php, and store.php), you can see that, in version 14.2,1387

they all have this useLeftNav boolean flag set to true.1397

And here it is on department.php.1401

And so, that is how we are able to decide whether to output the left navigation bar on any individual page.1404

For the homework challenge for this lesson, I want you to just review how we change all of our while loops over to foreach loops,1417

and why we did that--because we are looping over arrays, and that is what a foreach loop is specifically made for.1424

And typically, you are not going to be using a while loop to loop over arrays.1431

The other thing is to make sure you understand how the structure of this new departments array we created works,1435

where the key of the array is the department ID, and then for the value associated with the department ID,1441

it contains information about the department, such as the name of the department and the items in it.1447

Also, make sure you understand how department.php works, by accessing the information in the departments array,1452

and also by accessing the item information in the itemCatalog array.1459

And see if you understand how it works, just like item.php, in that, instead of creating a separate page for each department,1465

just like with item.php, we have eliminated the need for creating a separate PHP or HTML page for each item.1473

By being able to dynamically generate an item's information by passing an item ID, department.php works the same way.1479

We don't have to create a separate department page for each department in the store.1486

We simply pass a department ID to it, and then it is able to go ahead and pull the information it needs to generate that department's page.1490

Also, just review the changes we made to the header.phtml to understand how we are optionally including the left nav bar, based on this useLeftNav flag.1498

And understand that that useLeftNav flag needs to be defined before we include the header.phtml file.1509

And that is what we use to decide whether, on a particular page, to output the left nav bar or not.1518

And then, also just notice, not just the while loops that we replaced with foreach, but just the prevalent use of foreach loops1524

that we have used all over our different pages, like in department.php, in header.phtml (when we loop over the different1532

departments in the departments array)--just see how the foreach is always used to loop over these different arrays.1540

That is its function, and that is what we are commonly going to be using, and you are commonly going to see.1548

That ends today's lesson; thank you for watching Educator.com, and I look forward to seeing you next time.1554