A good first step for creating search autosuggestions with Ajax is to create static placeholder results on the page and then use CSS to style them so that they look correct.
- View Offline
- Exercise Files
- [Narrator] In this movie, we will add…some CSS styles for our suggestions.…Now of course, we don't have suggestions…coming back from Ajax yet, but we can start…by styling static text.…Let's open up a couple of files.…Let's open up Includes>header.php.…And let's also open up public.css.…Those are the ones we're going to be working with.…The idea is that we want to add suggestions…that are going to appear here, and then we want…to style them using our CSS.…Now, even though we don't have actual suggestions yet,…I like to do this part first, partly so that they just…end up over here in the right place.…
So we want to at least have some minimal styles…so that our list appears here.…Even if it's ugly, we want the list…to be below the search box.…We don't want it to show up somewhere else on the page,…we want it to be in the right spot.…So, the one good way to do that, to see…how it's going to look ahead of time, is just to come into…the page and to put in some static tags.…Just to write HTML here, put a placeholder.…
- What is Ajax?
- Creating Ajax requests and responses
- Monitoring Ajax request state and events
- Responding to Ajax requests with HTML and JSON
- Building Ajax buttons
- Submitting forms with Ajax
- Implementing infinite scrolling
- Adding autosuggestions to text fields
Skill Level Intermediate
1. Ajax Defined
What is Ajax?5m 34s
2. Ajax Client
3. PHP Server
4. Ajax Button
5. Ajax Form Submission
6. Infinite Scrolling
7. Search Autosuggest
- Mark as unwatched
- Mark all as unwatched
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.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.