Скачать или смотреть Fixing the WordPress Admin-ajax.php 400 Bad Request Error While Submitting Ajax Forms

Learn how to resolve the `400 Bad Request` error when submitting Ajax forms in WordPress, especially when uploading files.
---
This video is based on the question https://stackoverflow.com/q/71220380/ asked by the user 'Monagraphic' ( https://stackoverflow.com/u/7478389/ ) and on the answer https://stackoverflow.com/a/71222467/ provided by the user 'Jigendra Thakor' ( https://stackoverflow.com/u/12738824/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: Wordpress admin-ajax.php 400 bad request error

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
Troubleshooting the WordPress Admin-ajax.php 400 Bad Request Error

Are you facing a 400 Bad Request error when trying to submit a form using Ajax in WordPress? You're not alone! This issue can be frustrating, especially when everything seems to be in order. In this post, we'll uncover the likely cause of this error and how you can fix it in your WordPress application.

Understanding the Problem

When you're working with Ajax in WordPress, using the admin-ajax.php file is essential for processing requests. However, when uploading files along with form data, many users encounter a 400 Bad Request error. This error typically occurs due to incorrect data being sent to the server.

In the code you've provided, the form seems to work fine when sending only text inputs, but fails with the file upload. Let's dive into the solution!

Solution: Adjusting Your JavaScript Code

The main issue is in how you are structuring the data being sent through your Ajax request. Let's break this down step by step:

Step 1: Identify the Current Data Structure

Here's the current structure you're using when making the Ajax request:

[[See Video to Reveal this Text or Code Snippet]]

Step 2: Update the Data Structure

The formData object is already encapsulating the action and the other form fields; there's no need to wrap it again in another object. You need to change your Ajax request to send the formData directly instead of nesting it. Here’s the correct implementation:

Replace the Code Block

Update your Ajax code segment as follows:

[[See Video to Reveal this Text or Code Snippet]]

Finalized JavaScript Code

Your entire JavaScript function should look like this after the modification:

[[See Video to Reveal this Text or Code Snippet]]

Conclusion

By updating the data structure sent in your Ajax request, you can successfully avoid the 400 Bad Request error when including file uploads in your WordPress form. Always remember that the FormData object is capable of handling both regular form inputs and file uploads with ease.

If you continue to face issues after making the changes, ensure that you have the necessary permissions and that no security plugins are blocking Ajax requests in the back end.

If you found this guide helpful, feel free to share it with others facing similar challenges!