[tuanvo]

I open a popup using Qi Addon elementor plugin, and inside the popup, there is a registration form. When I click submit without entering any information, the URL changes to /#wpcf7-f5341-o1/, and then the popup closes. When I reopen the popup, the form finally displays the validation error messages for the required fields.

Is there a way to make the error messages appear immediately when the popup opens, without requiring a submit action first?

[serkan]

Hi, Yes! The issue you’re experiencing is due to how Contact Form 7 (CF7) handles form validation and error messages. When the form is inside a Qi Addons for Elementor popup, CF7 scripts may not initialize properly because the form is initially hidden.

Solution: Force CF7 Validation on Popup Open
You need to manually trigger Contact Form 7 validation scripts when the popup opens. Here’s how you can do it:

1. Add This JavaScript Snippet
Place the following JavaScript in your Theme Customizer > Additional JS, or in an Elementor HTML widget:

jQuery(document).ready(function ($) {
    $(document).on("click", ".qi-popup-trigger", function () {
        setTimeout(function () {
            $(".wpcf7 form").each(function () {
                wpcf7.init($(this));
            });
        }, 500);
    });
});

How This Works:
Listens for the Qi popup trigger click event.
Waits for 500ms (adjustable) to ensure the popup is fully opened.
Reinitializes CF7 inside the popup to ensure validation errors show immediately.

2. Alternative: Use Custom CF7 Event
If the above doesn’t work perfectly, you can add this:

document.addEventListener('wpcf7invalid', function(event) {
    jQuery('.qi-popup-trigger').trigger('click'); 
}, false);

This ensures the popup stays open if validation fails.

3. Check Popup Settings
Ensure that:
The popup does not close on form submission.
CF7 JavaScript is not deferred or delayed by optimization plugins.

This should fix the issue and make validation errors appear immediately when the popup opens. Let me know if you need further adjustments! I also recommend that you try this on the child theme to avoid damaging the theme files.