JQuery Events and Functions

WPComplete provides several custom jQuery events and functions that allow developers to extend functionality or integrate with other scripts. These events fire when learners interact with WPComplete buttons, pages, or courses, making it possible to add custom actions such as animations, notifications, or analytics tracking.

Available Custom jQuery Events

The following events can be hooked into with jQuery:

• wpc-button-completed
• wpc-button-completed::post ID-Button Name
• wpc-page-completed
• wpc-page-completed::post ID
• wpc-course-completed
• wpc-course-completed::Course Name

Usage Examples

Trigger an action when any page is completed:

jQuery(document).on('wpc-page-completed', function(e) {
// do something awesome!
});

Trigger an action when a specific page is completed (e.g., post ID 430):

jQuery(document).on('wpc-page-completed::430', function(e) {
// do something awesome!
});

Celebrate when any course is completed:

jQuery(document).on('wpc-course-completed', function(e) {
// Trigger confetti falling or something else awesome!
});

React when a specific course is completed (e.g., “My Course”):

jQuery(document).on('wpc-course-completed::My Course', function(e) {
// do something awesome!
});

Trigger custom JavaScript when any WPComplete button is marked complete:

jQuery(document).on('wpc-button-completed', function(e) {
// trigger custom javascript!
});

Trigger an action for a specific button (e.g., post ID 430, name “Video-3”):

jQuery(document).on('wpc-button-completed::430-Video-3', function(e) {
// trigger custom javascript!
});

Marking a Button as Complete Programmatically

Buttons can also be marked as complete directly via JavaScript:

jQuery(document).ready(function() {
wpcomplete.complete(ID);
});

Re-Linking Buttons Added After Page Load

If new content is loaded dynamically (such as through AJAX), WPComplete buttons may need to be re-linked so they function properly. Use the following function:

wpcomplete.linkify();

This ensures that any new buttons or links are recognized by WPComplete.

Conclusion

The custom jQuery events and functions in WPComplete provide powerful tools for developers to integrate progress tracking with custom site behavior. From triggering animations to programmatically marking lessons complete, these hooks allow a high level of flexibility and control over learner interactions.