jQuery, Part 6 of 6: Data and Interactions

Course description

jQuery is a great for information exchange. This course “jQuery: Data and Interactions”, will start off with Ajax fundamentals, then move to submitting data with GET and POST. Next you will see how to work with JSON and paginating with Ajax data. Then the course will move on to advanced interactions with form validation, creating menus, drag and drop and finish up with creating custom jQuery plug-ins.

Each LearnNowOnline training course is made up of Modules (typically an hour in length). Within each module there are Topics (typically 15-30 minutes each) and Subtopics (typically 2-5 minutes each). There is a Post Exam for each Module that must be passed with a score of 70% or higher to successfully and fully complete the course.

Meet the expert

Dustin Tauer

Dustin Tauer is an Adobe Certified Master Instructor and has a degree in Informational Systems and Technology. He currently teaches development classes focusing on technologies like HTML, CSS, JavaScript, Flash, and Flex. When he’s not training, he’s working on development projects ranging from mobile applications to rich internet applications to instructor-led curriculum.

Video Runtime

116 Minutes

Time to complete

214 Minutes

Course Outline

Data

jQuery AJAX (12:49)

• Introduction (00:33)
• jQuery AJAX (02:07)
• Server-side scripts (01:15)
• Demo: Writing an AJAX method (03:54)
• Demo: Tracking network traffic (02:01)
• Demo: Handling returned data (02:40)
• Summary (00:17)

Get and Post Data (26:18)

• Introduction (00:33)
• Get and Post Data (02:35)
• Demo: Chained Select UI (00:59)
• Demo: Using .getJSON() (02:56)
• Demo: Coding chained select (03:09)
• Demo: Coding select options (03:08)
• Demo: Adding options into HTML (03:52)
• Demo: Refreshing selects (01:40)
• Demo: Resetting change event (02:47)
• Demo: Calling fetchSelect (01:29)
• Demo: Verifying requests (00:32)
• Demo: Regulating data (02:13)
• Summary (00:21)

JSON (10:08)

• Introduction (00:34)
• JSON (02:48)
• Demo: JSON (02:50)
• Demo: JSON and Chrome (01:57)
• Demo: Inspecting JSON code (01:38)
• Summary (00:19)

Pagination (07:48)

• Introduction (00:34)
• Pagination (01:29)
• Demo: Data list (02:53)
• Demo: Data list HTML (01:06)
• Demo: Pagination properties (01:23)
• Summary (00:20)

Interactions

Form Validation (18:03)

• Introduction (00:40)
• Form validation (02:45)
• Demo: Web form (01:17)
• Demo: Client-side validation (03:19)
• Demo: Third-party validation (02:32)
• Demo: Error messages (02:46)
• Demo: Email validation (02:50)
• Demo: Completed Form (01:33)
• Summary (00:16)

Creating Menus (11:24)

• Introduction (00:37)
• Creating Menus (01:17)
• jQuery Menu Events (01:12)
• Demo: Menu Creation (01:00)
• Demo: Animation API (03:28)
• Demo: Test Menu (00:37)
• Demo: Closing Menus (01:34)
• Demo: Stop Method (01:20)
• Summary (00:16)

Drag and Drop (11:38)

• Introduction (00:31)
• Drag and Drop (01:47)
• Drag and Drop options (01:48)
• Demo: Draggable (03:22)
• Demo: Droppable (03:51)
• Summary (00:17)

Creating Plugins (18:41)

• Introduction (00:39)
• Creating Plugins (01:25)
• Plugin Structure (02:02)
• Demo: Custom plugin (02:03)
• Demo: Naming plugins (00:42)
• Demo: Plugin defaults (01:48)
• Demo: Return loop (03:04)
• Demo: Importing plugins (00:59)
• Demo: Working with plugins (01:02)
• Demo: Overriding defaults (01:21)
• Demo: Animating plugins (03:10)
• Summary (00:20)