How to send form information to both HubSpot and Expression Engine simultaneously

I’m working with an Expression Engine website that has a contact form. Right now the form only saves data to our main database, but I also want to send the same information to HubSpot using their API.

Here’s my current form setup:

<form action="http://www.mysite.com/?ACT=15" accept-charset="utf-8" method="post">
    <input type="text" name="user_first" id="user_first" placeholder="{freeform:label:user_first} *">
    <input type="text" name="user_last" id="user_last" placeholder="{freeform:label:user_last} *">
    <input type="text" name="user_email" id="user_email" placeholder="{freeform:label:user_email} *">
    <input type="text" name="user_phone" id="user_phone" placeholder="{freeform:label:user_phone} *">
    <input type="text" name="organization" id="organization" placeholder="{freeform:label:organization} *">
</form>

I also created a separate PHP file to handle the HubSpot API submission:

<?php
// Send form data to HubSpot API to create new contact

$visitor_token = $_COOKIE['hubspotutk'];
$client_ip = $_SERVER['REMOTE_ADDR'];
$context_data = array(
    'hutk' => $visitor_token,
    'ipAddress' => $client_ip,
    'pageUrl' => 'http://www.mysite.com/contact-form',
    'pageName' => 'Contact Form Page'
);
$context_json = json_encode($context_data);

// Build the data string with form values
$post_data = "firstname=" . urlencode($user_first)
    . "&lastname=" . urlencode($user_last)
    . "&email=" . urlencode($user_email)
    . "&phone=" . urlencode($user_phone)
    . "&company=" . urlencode($organization)
    . "&hs_context=" . urlencode($context_json);

// Update with your actual portal ID and form GUID
$api_url = 'https://forms.hubspot.com/uploads/form/v2/{yourPortalId}/{yourFormGuid}';

$curl = @curl_init();
@curl_setopt($curl, CURLOPT_POST, true);
@curl_setopt($curl, CURLOPT_POSTFIELDS, $post_data);
@curl_setopt($curl, CURLOPT_URL, $api_url);
@curl_setopt($curl, CURLOPT_HTTPHEADER, array('Content-Type: application/x-www-form-urlencoded'));
@curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
$api_response = @curl_exec($curl);
@curl_close($curl);
echo $api_response;

?>

I think I need to use jQuery and AJAX to make this work, but I’m not sure about the exact implementation. Can someone help me figure out how to submit to both destinations when the form is submitted?

Skip AJAX and handle both submissions server-side using Expression Engine’s form processing hooks instead. It’s way more reliable since you don’t need JavaScript enabled. Build a custom EE extension that kicks in after form submission - it’ll grab the form data, shoot it over to HubSpot with your PHP code, then let EE do its normal thing. Both systems get the data even if one fails. Alternatively, modify your existing PHP script to save data into your EE database after HubSpot gets it successfully. Just direct your form action to your custom PHP file instead of the default EE handler. Ensure proper error handling and validation that aligns with your current EE setup.

Had the same issue with EE and HubSpot about 6 months back. Skip the dual endpoints and JavaScript mess - just use Expression Engine’s Freeform extension hooks to grab form data after submission. Build a simple extension that listens for the submission event, then quietly sends that data to HubSpot using your PHP code. Users only see the normal EE success message while HubSpot gets updated behind the scenes. If HubSpot craps out, your main form still works fine. Don’t forget to sanitize your data before hitting HubSpot’s API and add logging so you can catch any integration problems.

You’re on the right track with AJAX, but there’s an easier way. Skip the two separate endpoints and create a middleware PHP script that handles both submissions one after the other. Point your form to this new script - it processes the EE submission first using cURL, then immediately sends the same data to HubSpot. I’ve done this on several EE sites and it’s rock solid. Just make sure your middleware captures the EE response correctly and only hits HubSpot if EE succeeds. Throw in some error logging to catch any failures. Plus, this keeps your form working even when JavaScript’s disabled, which pure AJAX can’t do.

I dealt with this exact thing last year on a client’s EE site. Here’s what worked perfectly: use JavaScript to hit both endpoints one after the other. Intercept the form with jQuery, prevent the default submit, then fire your HubSpot AJAX call first. When that’s done, submit the form to Expression Engine using the original action URL. You get way better error handling and user feedback this way. If HubSpot craps out, the EE submission still goes through so users don’t get stuck. Throw in a loading spinner and show success/error messages. Main thing is don’t let a failed HubSpot call block the EE submission.

the dual submission thing sounds way too complicated. just use hubspot’s webhook feature - it’s much simpler. set up your ee form normally, then add a webhook that automatically pushes the data to hubspot after someone submits. no extra php files or ajax calls needed. everything runs server-side and you get error handling built in. way cleaner approach.