To finish the search autosuggest demo project, learn to take the search autosuggest results returned by PHP as JSON data, convert it into HTML list and link tags, and put the results on them page under the text input box.
- [Instructor] In the previous movie,…we were able to search through our data set,…find the suggestions that we wanted to return,…and send them back to the…Ajax request as json data.…Now, we need to take that json data,…we need to properly format it as html…and put it on the page so the user can see it.…Let's start by going in to public.js,…and I'm going to start out by taking out the…place where put in the fake json before.…We don't need that any more.…We actually have real json now.…So that real json result that…comes back in response text…will now be parsed into proper json,…and it will be passed to…the showSuggestions function.…
Scroll up here,…showSuggestions takes json as an argument.…You can see that we already have…some style information here that will…make it that suggestions appear.…What we need to do now is take that json…and convert it into html.…Let's just review what that needs to look like.…Let's look at the header.php.…Here's our suggestions that we created earlier.…So, inside our ul,…we needed to come up with li tags…
- 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.