POST information to 2 areas. PHP / Javascript

Question

Just wondering if you can try and assist.

I have a register form in WordPress that is being posted to a user database. I also need to pass the same form information to a webhook (Zapier).

I understand you cannot have 2 form action's for one form however I ideally need to find the best way of submitting both sets of information; one to the database and one to the webhook link.

An example of my code posting to my database. I need this to also post to

https://zapier.com/examplehook/

<form name="register_form" id="register_form<?php $template->the_instance(); ?>" action="$template->the_action_url( 'save-register' ); ?>" method="post”>

I was thinking of possibly using an onclick event to run a javascript function that also does a simultaneous form action. I'm confused if that would work though.

//edited code

$('#registerform').validate({ // initialize the plugin
        rules: {
            first_name: {
                required: true
            },
            last_name: {
                required: true
            },
            user_email: {
                required: true,
                email: true
            },
            user_login: {
                required: true
            },
            hear_about_us: {
                required: true
            },
            contact_number: {
                required: true
            },
            address:{
                required: true
            },
            post_code: { 
                required: true
            }
        },
        submitHandler: function (form) {
            $('#registerform').on('submit', function(event) {
                event.preventDefault();

                var xhr1 = $(this).ajaxSubmit({url: 'https://zapier.com/example-hook/'}).data('jqxhr');
                var xhr2 = $(this).ajaxSubmit({url: '/register/'}).data('jqxhr');


                $.when(xhr1, xhr2).then(function() {

                    window.location.replace("/register-step2/");

                }, function() {
                    // error occured
                });
            });
        }
    });

Any suggestions would be ideal!

Thanks

Answer 1

You can use Jquery Form Plugin for this:

$('form').on('submit', function(event) {
    event.preventDefault();

    var xhr1 = $(this).ajaxSubmit({url: 'http://firsturl'}).data('jqxhr');
    var xhr2 = $(this).ajaxSubmit({url: 'http://secondurl'}).data('jqxhr');

    $.when(xhr1, xhr2).then(function() {
        // both submits succeeded, redirect
    }, function() {
        // error occured
    });
});