While working on a WordPress site, I embedded a Gravity Form inside a dropdown submenu of the navigation menu. The submenu appears on hover, and inside it, users can submit an enquiry form via Gravity Forms using AJAX.

Everything worked fine, until the form was successfully submitted.

Good : If validation failed, the form stayed open and errors were visible.

Bad : But when the form successfully submitted, the confirmation message would briefly flash — and the submenu would immediately disappear, making it look like nothing happened.

This wasn’t a great user experience, especially if users didn’t realise their form had gone through.

Why It Happens

When Gravity Forms submits via AJAX, it dynamically replaces the form’s content with the confirmation message. This causes a DOM update that disrupts the hover state of the submenu, especially if it’s tied to :hover CSS.

So, the submenu disappears — not because of an error, but because the browser no longer sees the user as “hovering” during or right after the form update.

The Solution

The fix is to manually reapply a class to keep the submenu open when the form is successfully submitted, then remove that class when the user moves the mouse away.

You don’t need any complex JavaScript frameworks — just a few lines of jQuery and a little CSS.

jQuery(document).ready(function($) {
 var menuItem = $('#menu-item-1798'); // ID of the parent menu item

 // When the form is successfully submitted via AJAX
 $(document).on('gform_confirmation_loaded', function(event, formId) {
  if (formId === 5) { // Replace with your actual form ID
   menuItem.addClass('keep-open');
  }
 });

 // When user moves their mouse out of the menu item, close it
 menuItem.on('mouseleave', function() {
  if (menuItem.hasClass('keep-open')) {
   menuItem.removeClass('keep-open');
  }
 });
});

Optional CSS

Add proper style to your stylesheet to ensure the menu stays visible when the keep-open class is active.

The Output

With this small enhancement:

• The submenu remains open after a successful Gravity Form submission.
• Users can clearly see the confirmation message.
• The menu closes cleanly once the user moves away.

 It works beautifully without any plugin overhead or redesigns.

Have you run into a similar problem? Got a cleaner approach ? Drop your thoughts in the comments!