Troubleshooting 400 Bad Request Errors for Leads in Elementor Form Connector

If you notice that leads are not coming into your system and your logs are showing 400 Bad Request errors during webhook calls, this article will help you identify and fix the issue.

What is Happening? #

When submitting a form via Elementor Form Connector, your system expects specific data fields in the webhook request. If these fields are incorrectly mapped or missing, the webhook responds with a 400 Bad Request error, preventing the lead from being created successfully.

You might see logs or screenshots indicating a successful webhook response error, which can be confusing — the form seems to send data, but the system rejects it due to improper data format or mapping.

Root Cause: Incorrect Field Mapping #

After a detailed review, the cause of this error has been identified as incorrect form field mapping between Elementor Form Connector and your webhook endpoint.

Elementor sends form data in a nested format, and your webhook expects fields in a precise structure. If the mapping does not match the expected format, the request is considered invalid.

How to Fix: Use the Form URL Decoder and Map Fields Correctly #

To resolve this:

1. Decode the Form URL Data

   Use a tool like the Form URL Decoder to decode the form submission URL and view the exact field names and values being sent by Elementor.
   

Link:- https://www.urldecoder.org/

1. Check the Field Structure

   Elementor sends form fields in the format:

   fields[FieldName][value]
   

   For example, the mobile number field might look like this in the webhook data:

   fields[Mobile][value]
   

2. Map the Fields Correctly

   When setting up the webhook or integration, ensure the field names are mapped using the above structure. For example:

   Elementor Form Field	Webhook Field Mapping
   Mobile	fields[Mobile][value]
   Email	fields[Email][value]
   Name	fields[Name][value]

   This ensures your system receives the data in the correct format and prevents the 400 Bad Request error.
   

Summary #

• Issue: Leads not arriving due to 400 Bad Request errors.

• Cause: Incorrect mapping of Elementor Form Connector fields to webhook.

• Solution: Use a URL decoder to inspect form data, then map fields as fields[FieldName][value] in your webhook integration.