Start learning with our library of video tutorials taught by experts. Get started

Building Facebook Applications with PHP and MySQL

Showing navigation


From:

Building Facebook Applications with PHP and MySQL

with Ray Villalobos

Video: Showing navigation

In the last movie we set up the variables we need to be able to navigate through our different pages. In this video I'm going to walk you through showing our pagination in our Facebook application. So first things first. We only want pagination on a page if there's more than one page, so I'll add an if statement to check for that, and I'm going to end that if statement right here. So now I'm going add a div so that I can style our paging section. Let's add a line that lets our users know which page they're on.

Watch this entire course now—plus get access to every course in the library. Each course includes high-quality videos taught by expert instructors.

Become a member
Please wait...
Building Facebook Applications with PHP and MySQL
1h 45m Intermediate Jan 16, 2013

Viewers: in countries Watching now:

Learn the basics of building complex, data-driven applications with the Facebook PHP SDK and MySQL. Author Ray Villalobos first introduces the fundamentals, such as checking to see if a user is logged into an application, accessing Facebook user data through the Open Graph API, and making complex API calls with the Graph API Explorer. The course then dives into building an application with API paths and Facebook Query Language (FQL) calls. Along the way, you'll discover how to post to a user's wall, upload photos, integrate with webpages, and more.

Topics include:
  • Downloading and installing the PHP SDK
  • Logging in and authenticating users
  • Accessing Open Graph data
  • Working with connection subpaths, limits, and subsearches
  • Styling a Facebook app with CSS
  • Setting up pagination
  • Understanding Facebook Query Language (FQL)
  • Integrating query results into a full-scale application
Subjects:
Developer Web Databases Web Development
Software:
Facebook MySQL PHP
Author:
Ray Villalobos

Showing navigation

In the last movie we set up the variables we need to be able to navigate through our different pages. In this video I'm going to walk you through showing our pagination in our Facebook application. So first things first. We only want pagination on a page if there's more than one page, so I'll add an if statement to check for that, and I'm going to end that if statement right here. So now I'm going add a div so that I can style our paging section. Let's add a line that lets our users know which page they're on.

The navigation I'll build will have previous and next buttons, plus a series of numbers so that users can jump to each page. So we need to create a div for this section as well. I am going to call this pagenav. To make it look a little bit clearer, I'm going to modify this comment to say moviegroup, and let me go ahead and indent this a little bit better. Let me go ahead and Save this, and to make sure we haven't made any mistakes, I'll switch back to my application, and I'll hit the Refresh button.

Now I'm going to scroll all the way to the bottom, and it should say something like Page 1 of 3 right here. Now we're ready to create our links. We'll start with the next link or the next button. I want to check that this isn't the last page, because we don't need a next button on the last page, so we have a variable for next offset. If the next offset is bigger than the number of friends we have, then we can output this link. So what we're doing here is passing the URL of this page, which we do by checking the server variable called _server and pass in the command SELF, it gives you the URL of this page, to that we add the offset by passing our next offset variable.

So it looks good to me. I'm going to save this and switch over to my app and then refresh the page, and now I can see a Next link. So as I said, sometimes this page come a little funky because of the iFrame, so just scroll up and down until it looks good to you. So if we roll over this link, you can see at the very bottom that we are calling the same page, plus and the offset of three, so I'll click on that, and it should be going to the next group of data. Now remember there are some users that did not like any movies, so that's why this page only has one result. Just go ahead and click on Next again, and it takes us to the last page, and that's Page 3 of 3, so we know our navigation to go forward is working properly, and now we need to build navigation to go the other way.

So now we can do a Previous link, it's pretty similar to the Next link, so I'm going to copy this code, and I'll paste it right on top. I'll modify its variable to be the current offset minus the quantity, which will take us back to another page, and this time I'm going to check that the current offset is less than or equal to the quantity of users, that's to make sure that there is no link on the first page.

On the first page, the quantity is going to be the same as the current offset, so this will not show, and I need to modify the class of this span to say Next. So let me save that, and I'll switch over to my app, refresh the page, scroll down to the bottom. I see the next link, so I need to click on this first to go to my next page, and now I see a Previous link, as well as a Next link, let's click on the Previous link, it takes us back to our first page, click on Next a couple of times to go to the last page, make sure we don't have a Next link on the last page, and that our Previous link does show up, so this is working great. So now let's go ahead and output page numbers.

For that we're going to use a forloop, and we'll do that in between the Previous and Next links. So we're going to take to the I variable in the loop is greater then the total pages, and it's going to be a little strange we're going to create a span, but we're not going to close it right here; we're going to leave it open so that we can add another class if this happens to be the current page. Because of the zero indexing of this loop, we need to check for current page -1.

Now we can close the opening part of our span tag, and I'll go ahead and output the closing tag as well. Now we're ready to output each page number that's going to be a regular anchor tag, but that is going to point to the current page and then we'll pass it an offset variable, and the offset variable will be the current number of the loop times the quantity, which will be how much we want to offset on each page, and as the label, we're going to want the I variable +1, because it's zero indexed.

So, it looks like I missed the comma, let me make sure I put this comma right here, and I need to fix another typo at the bottom of the screen. I want to add a closing angle bracket to this div right here. I'll save it, and I'll refresh my page, scroll down to the bottom, and even though it doesn't look that great right now, we can see that there's pages 1, 2, and 3. The number 1 sets you need to offset 0, the number 2 to offset 3 and the number 3 to offset 6.

So that should paginate correctly. If we click on those links, we go to the second page, you can see the Previous and Next links right next to each other. So creating the pages is just a matter of putting our variables to work that allow us to programmatically create the links to different pages. This doesn't look very good right now, but in the next movie I'm going to show you how to style our navigation.

There are currently no FAQs about Building Facebook Applications with PHP and MySQL.

Share a link to this course
Please wait... Please wait...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.
Upgrade now


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

join now

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed Building Facebook Applications with PHP and MySQL.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Welcome to the redesigned course page.

We’ve moved some things around, and now you can



Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked