Solve - $.post is not a function jQuery Error

avatar

Borislav Hadzhiev

Tue Oct 19 20212 min read

banner

Photo by Ali Kazal

Solve - $.post is not a function #

The "$.post is not a function" jQuery error occurs for multiple reasons:

  1. Loading the jQuery slim version instead of jQuery.
  2. Loading the jQuery library twice.
  3. Specifying an incorrect path to the jQuery files.

jquery post is not a function error

To solve the "$.post is not a function" jQuery error, make sure to load the full version of the jQuery library. The slim version of the library excludes some functions like ajax and post. The library should only be loaded once on the page, otherwise the error is thrown.

jQuery regular version

Here's a complete working example.

index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> </head> <body> <button id="btn">Click me</button> <!-- ✅ load jQuery ✅ --> <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous" ></script> <script src="index.js"></script> </body> </html>

We loaded the regular jQuery version (not the slim one) and ran our script after.

Here's the code for the index.js file.

index.js
$(document).ready(function () { $('#btn').click(function () { $.post( 'https://reqres.in/api/users', { name: 'paul rudd', movies: ['I Love You Man', 'Role Models'], }, function (data) { console.log(JSON.stringify(data, null, 4)); }, ); }); });

We wait for the DOM to be ready and add an event listener on a button.

If the button is clicked, we make a POST request to a remote API and log the results to the console.

If you open your browser and click on the button, you'll see the response in your console.

jQuery post

If you're still getting the error, make sure you're not loading the jQuery library twice. Loading the library twice re-runs the initialization process and causes this and other errors.

Lastly, if you're loading the library from a file on your local file system, make sure the path to the file is specified correctly.

Passing an incorrect path to a script is the same as not loading the script at all.

To check if the path is correct, open your console and look if you're getting 404 errors related to the jQuery script.

Use the search field on my Home Page to filter through my more than 1,000 articles.