jQuery .post() Method

Beginner
8 min read
Updated: Oct 2026
5 examples
Live preview

What Is $.post()?

jQuery.post(url [, data] [, success] [, dataType]) sends an HTTP POST request (since 1.0). It is shorthand for $.ajax({ type: "POST", … }). Data goes in the request body — not the URL.

Remember
$.post("ajax/test.html", function (data) {
  $(".result").html(data);
});

// Equivalent to:
$.ajax({
  type: "POST",
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

// POST responses are never cached
NeedUse
Simple POST$.post(url, data, success)
Read / GET$.get()
JSON response helper$.getJSON()
Full control$.ajax()
Encode object → body$.param() (used internally)

How to Use $.post()

Pick a URL, optional body data, then handle success — and always plan for failure.

  1. Call $.post(url) or pass a data object/string for the body.
  2. Add a success callback, or chain .done() on the returned jqXHR.
  3. Optionally set dataType (e.g. "json") as the fourth argument.
  4. Chain .fail() so errors are not silent.
  5. For forms, use .serialize() or preventDefault + Ajax submit.
PieceRequired?Role
urlYes*Endpoint to POST to (*or inside settings object)
dataOptionalObject/string sent in the request body
successOptionalfunction(data, textStatus, jqXHR)
dataTypeOptionalExpected response type (xml, json, script, text, html)

Pseudocode

Pseudocode
call $.post(url [, data] [, success] [, dataType])
    → internally $.ajax({ type: "POST", url, data, success, dataType })

encode data with $.param() if it is an object
send HTTP POST (never cached)

when response arrives:
    if success status:
        parse by dataType (or intelligent guess)
        call success(data, textStatus, jqXHR)
        resolve jqXHR → .done() handlers
    else:
        reject jqXHR → .fail() handlers
        (silent unless .fail() or ajaxError is registered)

.finally → .always() handlers

Cheat Sheet

Keep these facts handy while wiring POST requests.

TopicDetail
Signature$.post(url [, data] [, success] [, dataType])
Settings form$.post({ url, data, … }) since 1.12 / 2.2
ReturnsjqXHR (Promise-like)
Body encodingObjects via $.param() → application/x-www-form-urlencoded
CacheNever — POST is always fresh
ErrorsSilent unless .fail() or global ajaxError
Prefer.done() / .fail() / .always()
SincejQuery 1.0

Live Preview

Send a real POST to a public JSON API and watch success or failure.

Demo uses JSONPlaceholder. Needs network access.

Result
Ready — pick an action and click Run.

jQuery Examples

Short, copy-ready snippets. Open DevTools Console, or use Try It Yourself for a live editor.

Example 1 — POST with Data + Success

Official pattern: send a payload and handle the response.

jQuery
$.post("test.php", { name: "John", time: "2pm" })
  .done(function (data) {
    alert("Data Loaded: " + data);
  });

// Live demo style:
$.post("https://jsonplaceholder.typicode.com/posts", {
  title: "My new post",
  body: "Created with $.post()",
  userId: 1
}, function (data, textStatus, jqXHR) {
  $("#result").text("Created post #" + data.id + " (" + textStatus + ")");
});
Try It Yourself

How It Works

  1. Body. The data object is serialized with $.param() into the POST body.
  2. Send. jQuery issues an HTTP POST (never cached).
  3. Success. The callback receives (data, textStatus, jqXHR).
  4. Update. Use the response to update the UI.

Example 2 — Fourth Argument "json"

Tell jQuery to parse the response as JSON before your callback runs.

jQuery
$.post("test.php", { func: "getNameAndTime" }, function (data) {
  console.log(data.name); // John
  console.log(data.time); // 2pm
}, "json");
Try It Yourself

How It Works

  1. Hint. The fourth argument sets expected dataType.
  2. Parse. jQuery converts the body to a JavaScript object.
  3. Callback. You read properties like data.name directly.
  4. Invalid JSON. Parsing failures reject the jqXHR — use .fail().

Example 3 — POST Serialized Form Data

Official pattern: pass $("#form").serialize() as the body.

jQuery
$.post("test.php", $("#testform").serialize());

// With feedback:
var payload = $("#contact-form").serialize();
$.post("https://jsonplaceholder.typicode.com/posts", payload, function (data) {
  $("#status").text("Saved! id=" + data.id);
}, "json");
Try It Yourself

How It Works

  1. Read. .serialize() builds a URL-encoded string from named fields.
  2. Send. Pass the string as data — jQuery does not re-encode strings.
  3. POST. The string becomes the request body.
  4. Respond. Handle the server reply in success / .done().

Example 4 — Ajax Form Submit

Official demo idea: intercept submit, POST via Ajax, update a result box.

jQuery
$("#searchForm").on("submit", function (event) {
  event.preventDefault();

  var $form = $(this);
  var term = $form.find("input[name='s']").val();
  var url = $form.attr("action");

  var posting = $.post(url, { s: term });

  posting.done(function (data) {
    $("#result").text("Search sent: " + term);
  });
});
Try It Yourself

How It Works

  1. Block. preventDefault() stops a full page navigation.
  2. Read. Pull field values and the form action URL.
  3. POST. $.post() sends the data asynchronously.
  4. Update. .done() refreshes a result region without reload.

Example 5 — .done() / .fail() / .always()

Official jqXHR chaining — attach handlers after the request starts.

jQuery
var jqxhr = $.post("example.php", function () {
  alert("success");
})
  .done(function () { alert("second success"); })
  .fail(function () { alert("error"); })
  .always(function () { alert("finished"); });

jqxhr.always(function () {
  alert("second finished");
});
Try It Yourself

How It Works

  1. jqXHR. $.post() returns a Promise-like object.
  2. Success. .done() runs on HTTP success.
  3. Error. .fail() runs on network/HTTP failure — avoid silent errors.
  4. Always. .always() runs for either outcome (cleanup, spinners).

Edge Cases & Pitfalls

Check these before shipping form POSTs and create APIs.

silent

Errors are silent by default

Without .fail() or a global ajaxError handler, failed POSTs look like nothing happened.

cache

POST is never cached

cache / ifModified from $.ajaxSetup() do not apply to $.post().

cors

Same-origin policy still applies

Cross-origin POSTs need CORS. Most browsers block plain cross-domain Ajax without it.

json

Default body is not JSON

Objects become form-urlencoded. For application/json, use $.ajax() with contentType and JSON.stringify.

Browser Support

$.post() has been part of jQuery since 1.0. The settings-object form arrived in 1.12 / 2.2. It works wherever your loaded jQuery version can run Ajax.

✓ Stable · jQuery 1.0+

jQuery.post()

Works in every browser that runs your loaded jQuery version. Prefer a current jQuery 3.x build for modern projects.

100% With jQuery Ajax
Google Chrome All versions · Desktop & Mobile
Full support
Mozilla Firefox All versions · Desktop & Mobile
Full support
Apple Safari All versions · macOS & iOS
Full support
Microsoft Edge All versions · Chromium & Legacy
Full support
Internet Explorer IE 6+ · Legacy environments
Full support
Opera All modern versions
Full support
$.post() Universal

Bottom line: Safe for everyday form POSTs and create APIs. Always chain .fail(), and use $.ajax() when you need JSON bodies or custom headers.

Performance Notes

ApproachCostBest for
$.post(url, data)CheapSimple form / create requests
Large serialized formsHigherSend only needed fields
JSON body via $.ajax()ClearerNested APIs expecting JSON

A single POST is inexpensive. Cost is usually network and payload size — keep bodies small and avoid posting unused form fields.

Key Takeaways

  • Role: readable POST shorthand for $.ajax({ type: "POST" }).
  • Body: objects become form-urlencoded via $.param().
  • jqXHR: chain .done() / .fail() / .always().
  • Safety: never cached; errors are silent unless handled.

One line: $.post() is jQuery’s one-liner for sending data in an HTTP POST body.

Frequently Asked Questions

jQuery.post() is a shorthand for $.ajax() configured as a POST request. Pass a URL, optional data, optional success callback, and optional dataType. Since jQuery 1.12 you can also pass a settings object: $.post({ url, data, dataType }). It returns a jqXHR object.
Both share the same positional signature, but $.post() sets type to POST so data goes in the request body (application/x-www-form-urlencoded by default), while $.get() appends data to the URL. Use $.get() for reads and $.post() for writes and form submissions.
A jqXHR object — a Promise-like wrapper around XMLHttpRequest. Chain .done(fn) for success, .fail(fn) for errors, and .always(fn) for either outcome. Handlers can be attached after completion; if the request already finished, the callback fires immediately.
No. Pages fetched with POST are never cached. The cache and ifModified options in $.ajaxSetup() have no effect on $.post() requests.
Yes — unless you chain .fail() on the returned jqXHR or register a global ajaxError handler, errors do not surface. The success callback simply never runs. Always chain .fail() when users need feedback.
Use $.post() for simple POSTs. Use $.ajax() for full control: custom headers, contentType application/json, beforeSend, processData false for FormData, global false, or other settings not exposed as positional arguments.

Next: jQuery.getJSON()

Fetch JSON with a dedicated GET shorthand.

jQuery.getJSON() tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

9 people found this page helpful