Check out a free preview of the full PHP Basics course
The "Passing Data to the Details Page" Lesson is part of the full, PHP Basics course featured in this preview video. Here's what you'd learn in this lesson:
Maximiliano finishes the master-detail example for the Frontend Museum project. The GET superglobal variable accesses the index property passed in the URL. The index is used to display the details for the exhibit.
Transcript from the "Passing Data to the Details Page" Lesson
[00:00:00]
>> Maximiliano Firtman: So we have index.php and details.php. By the way, do I have, I think I deleted from index.php the UL, that is not in the header, right? No, it shouldn't be here. So I want the UL,
>> Maximiliano Firtman: Here and here. You'll understand why I need that in a second, there.
[00:00:28]
Okay, so what do I want? I want here to render a list, something like this, I want to see one object. I'm going to hard-code this first, and then we change it with the code. One element, and I wanna go to details.php and I wanna pass, so our data collection has title, description, and image.
[00:00:56]
We don't have an ID actually, so we need to find we need to select one of these as a way to, as a key, okay, of course, on a real database, you typically has an ID. So we can take the title, for example, so I can pass the title, and I can pass that as an example, okay, it should be an ID.
[00:01:17]
We should add an ID, actually, for the real app, okay, so let's solve the problems that we have. So first, execute, we change the name. Remember, we changed the name to executeOne because we thought that it was actually giving us one element. It's actually giving us one element.
[00:01:33]
The thing is that let's first try to get into that for a sec. So let's go to DB again, and let's analyze this code again. So, result is actually giving us an array. When we look at the code, when we look at the explanation that we have here, it fetches a result row as an associative array, blah, blah, blah.
[00:01:59]
By default, it fetches both, blah, blah, blah. But it's giving me a result row of the next position. So remember I mentioned that typically when you connect to databases, you have two ways. You receive all of them, or you go one by one, it's a cursor, it's a pointer.
[00:02:20]
fetchArray is actually a pointer, so actually it's not returning me all of them, just the first one. So maybe what I need to do is collect them first and return them all. Or pass the pointer, or somehow store the pointer in a local property so they can ask me for more.
[00:02:44]
But let's do this, you will get what I'm doing in a second. We can check, while we are getting a row, because if it's empty, we will get nothing. We're going to fetch more arrays of the same query. Okay, let's see, and then all will actually be a collection that I wanna create.
[00:03:07]
I wanna collect there all of them, so I can start as an empty array and somehow I want to collect all of them. So fetchArray will bring me the next exhibit over the same result. It moves a pointer to a next one, so then I pull another one.
[00:03:30]
It moves the pointer to the next one, pull another one, until I don't have a row, which means you are at the end. Does that make sense? So now, how to collect in an array? We didn't mention this, but arrays in PHP, they have dynamic length, so I can add and remove elements as much as I can.
[00:03:54]
So well, let's say we know it's array_push, and what's the order of the elements? We first pass the array and then what do you want to add. So the array is all and what we want to add is row, the current row, that's make sense? Actually, we could put this directly in the while condition, but yeah, I don't think we want to do that from clarity, does that make sense?
[00:04:26]
So let's see now what happens, let's go back to index.php and refresh. Now we say, well, it wasn't executeOne as we thought, right? Maybe we can go back to the idea of call this execute, as we originally thought. And now we go to index.php, go to the browser, start closing some tabs that I don't use.
[00:04:53]
And I refresh and I'm seeing something different, okay, than before. I don't have any errors, I'm seeing something different. So what's going on here, well, this is a var_dump that I need to remove, okay, so let's do that. Where is that var_dump, by the way? Here, so now, for each exhibit, what I want, actually, I don't wanna see one element, I wanna take from the current exhibit, that is an array from the current object, remember to open php here.
[00:05:25]
I can go to a new line and I want to echo object["title"]. So if this is working, at least I'm seeing this. Yeah, maybe I should change some CSS. For this, let's call this the master, so then we go and say the links in the master, CSS, you know how to deal with that, but I can say the link.
[00:05:56]
So in master a I want the color to be white or something like that, so we can actually see them, okay? And even with a larger font size it will be good, maybe you can try black as well with this design, or maybe we can also try background-color:white let me add some CSS here, display.
[00:06:24]
I'm not sure how confident are you with writing CSS on the fly? We can say inline-block because it's a link, so I will convert that to inline-block so for example, I can add some paddings to it and some margins. Then background-color, maybe 15 pixels. So cross your fingers.
[00:06:47]
Yeah, okay, better. I'm not a designer, right, but yeah. So now I wanna click here and I wanna get into the details, that's my final step here, okay? So to do that, okay, we need to check the link, because the link, now I have a title, again, the title is not a good idea.
[00:07:07]
Also, instead of this, can I pass the index? So for example, I wanna see the first one, instead of passing the title, because as we don't have a key, a primary key. Can I do that? Where is it? Well, foreach, if you remember when Visual Studio was suggesting me foreach, can let me receive the key if I want to.
[00:07:30]
So instead of receiving the object, I can receive i=>$object, like that. So now I have the index, again, remember. We need to use the same order all the time. But now, if I refresh, if I click here, it goes to details.php, index 0, and this one, index 1, and one, index 2.
[00:08:02]
So now we can finish details.php. So details.php is kind of doing nothing, it's actually doing it foreach with the var_dump there, remove that. I don't need the foreach, I just need one. Makes sense? So only one, I need one. So I will just take one exhibit, which one?
[00:08:24]
This, I mean, it's not the most performant solution, the one we're doing. We can make it better, so I want one exhibit. Where should I take it from? I have the collection of exhibits, that's an array. I need the index, so I'm passing the index in the URL.
[00:08:49]
Remember the super global variable _GET? I can get it from there, so that's the pattern. So you go and say $_GET, can I use nested square brackets? Yeah, sure, why not? index, sorry, not ID. What if they're not passing me one? Well, I can select the first one just in case or give an error, but at least it's getting the first one.
[00:09:18]
Of course, you can add conditioners here, if, and make error messages. Now I don't have a foreach to end, so I don't need that, end foreach. And the only thing I need is now to render my design. I have my design in all.php, but I want it in this article.
[00:09:38]
Remember the article that we were rendering? So I'm copying this article into details here, I don't need the li actually, because we don't need a list in this, in details, okay? I'm deleting the list, we're just rendering our own HTML. I just need to render the article, and the article will take what it was called object here, so let's call it object here as well.
[00:10:06]
Object, so this is the deal. We have a master page listing the titles of our objects. You click on the object, you go to another page, and we are passing the index. On the other page, we go and grab again the database. We grab the index, we get the object, and we render the object on the screen.
[00:10:28]
>> Audience: Where's that index coming from on line 7?
>> Maximiliano Firtman: This one?
>> Audience: Yeah.
>> Maximiliano Firtman: The index is coming from the URL, and why is in the URL? Because the index.php, we added that to the URL, so we were making a link, we were appending the index in the link, so each link, let's go back here.
[00:10:50]
Each link has, by the way, you don't want to click, but when I right click > Inspect, each link has its own index. Instead of the index, you can use an ID on a real world database. You pass an ID or primary key, if it's a compound key, you need to pass all the data.
[00:11:11]
You pass enough information so it can be rendered on the other side. Does it make sense? So you are making all the links, so now I can get in this one, and I'm getting only that element. This is what is known as a master-detail navigation with server-side rendering.
Learn Straight from the Experts Who Shape the Modern Web
- In-depth Courses
- Industry Leading Experts
- Learning Paths
- Live Interactive Workshops