Displaying a Popup After Form Submission Using EngageBox

Convert Forms can display an inline message or redirect the user to another page after form submission. Sometimes, this does not fit your needs, and you may want to trigger a popup instead. Thankfully, Convert Forms integrates perfectly with EngageBox, the best popup extension for Joomla, allowing you to display a popup immediately after form submission. Let’s see how you can set this up.

Steps to Trigger a Popup on Form Submission

Follow these steps to configure EngageBox to display a popup when a Convert Forms submission is completed.

1. Edit Your Popup: Go to EngageBox in your Joomla admin panel and select the popup you want to display after form submission. If you haven’t created a popup yet, click New to create one.
2. Set the Trigger Point: Navigate to the Triggers tab and set the Trigger Point to Manually. This ensures that the popup will only appear when explicitly triggered by JavaScript.
3. Add the JavaScript Snippet: In the Advanced tab, locate the Custom JavaScript option and insert the following snippet:

// Set the ID of the form here
var formID = 123;

// Do not edit below
ConvertForms.Helper.onReady(function() {
	document.querySelector('#cf_' + formID).addEventListener('success', function(event) {
		var popup = EngageBox.getInstance({eb.id});
		popup.open();
	});
});

Save your popup settings and test the form submission to ensure the popup appears correctly. If it does not, verify that the correct form ID is set in the formID variable and that the popup is published on the same page as the form.