Learn to use PHP to determine which search results to return to the search autosuggest. Autosuggest works best with large data sets. For the demonstration project, we use a list of United States passenger train names.
- [Instructor] In this movie,…we will write the code to determine which suggestions…to return and send them back as json.…We should talk a bit about the kind of data…that we want to use for our autosuggest.…Autosuggest works best when we have large data sets,…certainly, over 100 records.…It works even better if there's 500 or 1,000, or even more.…And that makes sense.…There's no reason to make suggestions…if we only have a handful of records…to pull suggestions from.…In our case, we know that we're going to need data…that contains more than one suggestion…when we provide it the first three characters.…
It's not very useful to have autosuggest…if when we provide the first three characters,…it either returns no results or only one result.…It's going to be better if it can return multiple suggestions…when we give it three characters.…In the real world,…the kind of data that you could use might be product names,…maybe it's a database of your customers,…or it's article titles.…You could really use anything, it's up to you.…
Author
Released
11/7/2016- 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
Duration
Views
Related Courses
-
JavaScript and AJAX: Integration Techniques
with Ray Villalobos1h 12m Intermediate -
PHP 7 New Features
with Kevin Skoglund1h 4m Intermediate -
Design Aesthetics for the Web
with Sue Jenkins2h 45m Beginner
-
Introduction
-
Welcome55s
-
-
1. Ajax Defined
-
What is Ajax?5m 34s
-
-
2. Ajax Client
-
Requests5m 45s
-
Responses5m 20s
-
States and events6m 8s
-
Load remote text9m 25s
-
Load remote JSON8m 19s
-
Using jQuery3m 11s
-
-
3. PHP Server
-
Detect Ajax requests3m 30s
-
Respond with HTML partials5m 41s
-
Respond with JSON data6m 55s
-
Update page on change8m 13s
-
-
4. Ajax Button
-
Create a favorite button6m 26s
-
Send button Ajax request4m 40s
-
Process button Ajax request4m 57s
-
Handle button Ajax response3m 40s
-
Create an unfavorite button6m 34s
-
-
5. Ajax Form Submission
-
Create the form7m 17s
-
Gather form data7m 5s
-
Handle form errors10m 32s
-
Add a loading spinner5m 27s
-
Disable form button5m 55s
-
Allow fallback to HTML5m 37s
-
Prevent default4m 59s
-
-
6. Infinite Scrolling
-
Create a page of items6m 46s
-
Process a load request5m 20s
-
Append HTML results8m 38s
-
Use a data attribute4m 44s
-
Trigger Ajax on scroll3m 52s
-
Prevent multiple requests5m 40s
-
-
7. Search Autosuggest
-
Create a text input8m 6s
-
Style suggestions5m 32s
-
Format suggestions with JSON5m 20s
-
-
Conclusion
-
Next steps20s
-
- 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.
CancelTake 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.
Share this video
Embed this video
Video: Calculate results