Elementor Form additional webhook example

elementor-form-additional-webhook.php

<?php
/**
 * Plugin Name: Elementor Form Additional Webhook
 * Plugin URI: https://gist.github.com/csalzano/dfd754e0fe8b6ac10731fad8f257c0bf
 * Description: Adds a second Webhook to an Elementor form
 * Version: 1.0.1
 * Author: Corey Salzano
 * Author URI: https://breakfastco.xyz/
 * License: GPLv2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 */

class Elementor_Form_Additional_Webhook {

	function hooks(){
		//Add our additional webhook right here
		add_action( 'elementor_pro/forms/new_record', array( $this, 'manipulate_form_submission' ), 10, 2 );
	}

	function manipulate_form_submission( $record, $ajax_handler ) {

		$form_data = $record->get_formatted_data();

		//change the names of fields before we send them somewhere
		$new_data = array(
			'First_Name' => $form_data['First Name'] ?? '',
			'Last_Name'  => $form_data['Last Name'] ?? '',
			'URL'        => $form_data['Website'] ?? '',
		);

		$response = wp_remote_post( 'http://api.somewhere.com/', array( 'body' => $new_data ) );

		//if the failure of our additional webhook should prevent the form from submitting...
		if( is_wp_error( $response ) ) {
			$msg = 'There was a problem with the additional webhook.';
			$ajax_handler->add_error( 0, $msg );
			$ajax_handler->add_error_message( $msg );
			$ajax_handler->is_success = false;
		}
	}
}
$elementor_webhook_239909870234 = new Elementor_Form_Additional_Webhook();
$elementor_webhook_239909870234->hooks();

//Get the Elementor form ID
$form_id = $record->get_form_settings( 'id' );

//Get the Elementor form name
$form_name = $record->get_form_settings( 'form_name' );

Thank you! It helps a lot.

Thanks a lot for this snippet.

A great addition would be to include query params! For me this is a difficult as I am not familiar with php

query params

Not sure what do you mean by 'query params'

pass the query parameters in the url of the page to the webhook.

For example, I have a form with only the field $question, and a webuser is on the page 'www.domain.com/questions/?user=123'.

Then I want to have a post request like so:

//change the names of fields before we send them somewhere
		$new_data = array(
			'question' => $form_data['Question'] ?? '',
                        'user' => $query_parameters['user'] ?? ",
		);

The easiest way to get query parameter from URL, you can create a new form field and set the default value from the URL query parameter. And get it as a field in the webhook

Thanks a lot!

I cannot get the action to work, should it work if I place the gist in elementor-pro/modules/forms/actions file?

Put these codes to your theme 'functions.php' file.

Thanks so much, 5 hours wasted before this