Skip Navigation

[Resolved] jQuery after AJAX form submit

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Kolkata (GMT+05:30)

This topic contains 3 replies, has 2 voices.

Last updated by Minesh 2 months ago.

Assisted by: Minesh.

Author
Posts
#2778296

Hi, I need to use jQuery after AJAX form submit. I tried these snipets:

jQuery(document).ajaxComplete(function (event, xhr, settings) {
   
    if(settings.hasOwnProperty('extraData')){
        console.log('test1);
    }
     
});

jQuery( document ).ajaxComplete(function() { 
        console.log('test2);
});

jQuery(document).on('cred_form_ready', function(){
        console.log('test3);
});

None of them worked for me.

How can I run my on.click function after the form is submited with AJAX?

cheers

#2778308

I found the solution. I was loading the form inside [wpv-no-items-found]...[/wpv-no-items-found] shortcodes. These was breaking AJAX/JS. I put the form outside and now 'ajaxComplete' works fine.

cheers

#2778309

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

Well - here is a sandbox site and you can auto-login to it using the following link:
- hidden link

The following form is set to submit with AJAX:
=> hidden link

The form is added the following page:
- hidden link

As you can see there is a link "CLICK HERE" at top of the above test form page and if you click on this link it will show you alert with message "hi there" - that is added as given under with the above form:
=> => hidden link

<a href="#" id="anchor_click" onclick="javascript:alert('hi there');"> CLICK HERE </a>

I've added the following custom JS code to the form's custom JS editor that should run the click event automatically on form submit, so when you submit the form it should automatically show the alert "hi there":
=> => hidden link

jQuery( document ).ready(function($) {
  

  jQuery(document).ajaxComplete(function (event, xhr, settings) {
   
    if(settings.hasOwnProperty('extraData')){
        jQuery("#anchor_click").trigger('click');
    }
     
});
});

Now, when I submit the form and I see it does trigger the click event.
- hidden link

You can adjust the code as required.

#2778318

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

It seems we have cross-posted. You can mark this as resolved with different message.