HOWTO · jQuery

$.Ajax Data Type in jQuery

This tutorial demonstrates the use of $.ajax datatype in jQuery.

On this page

$.ajax uses the dataType option to describe the kind of response your code expects to receive. It affects how jQuery handles the response after it arrives. This is separate from contentType, which describes the format of data sent in the request body. For example, a request can send JSON while expecting a text response; choose each option for its own direction.

What dataType Means in $.ajax

Set dataType to a string such as "json" or "html". The value names the response format your success handler is prepared to use. It is not a MIME type: use "json", rather than "application/json". If you omit the option, jQuery may infer how to handle a response from its content type. When your application relies on a particular format, setting the expected type makes that intent clear.

The server still needs to return content that matches the format you request. Setting dataType: "json" does not turn arbitrary response text into valid JSON. Likewise, contentType does not select how the response is parsed.

Set dataType in a Basic $.ajax Request

Place the option in the settings object passed to $.ajax. Replace the example URL with an endpoint in your application. This self-contained JavaScript illustrates a settings object and prints its expected response type; it does not call $.ajax or send a network request.

Run this example:

const request = {
  url: "/api/employees",
  method: "GET",
  dataType: "json"
};
console.log(`${request.method} ${request.url}: expecting ${request.dataType}`);

Output:

GET /api/employees: expecting json

In an application that loads jQuery, pass those settings to $.ajax, then handle the parsed response in success or in a promise callback. For a request that sends a body, set contentType to describe that body and use data for its value. Do not add a request-body content type to a bodyless GET request without a reason.

Choose a Response Type

Choose the value according to the response your application needs to process:

  • "xml" is for an XML document that your code will inspect or process.
  • "html" is for an HTML fragment or document that your code will use as markup. Treat returned markup as untrusted unless your application has a safe handling strategy.
  • "script" is for a response intended to be evaluated as JavaScript. Use it only with a trusted source and when evaluating a remote script is appropriate.
  • "json" is for structured data that your code will use as a JavaScript value, such as an object or array.
  • "jsonp" is for a JSONP endpoint that returns a callback-wrapped response. It is a distinct response mechanism, not a general way to make any JSON endpoint cross-domain.
  • "text" is for a plain string that your code will process itself.

The option should match the endpoint’s actual response. If the response format or server behavior differs from the assumption, investigate the response and the request rather than changing the option at random.

Examples for Each Response Type

Each line below is an illustrative $.ajax settings object, not an executed request. The endpoint paths are placeholders; replace each with a URL that returns the stated format and add the success handling your application needs.

  • XML: $.ajax({ url: "/placeholder.xml", method: "GET", dataType: "xml" }) expects an XML response for your code to inspect or process.
  • HTML: $.ajax({ url: "/placeholder.html", method: "GET", dataType: "html" }) expects markup; use a safe handling strategy for returned HTML.
  • Script: $.ajax({ url: "/trusted-script.js", method: "GET", dataType: "script" }) is for JavaScript intended to be evaluated. Use only a trusted source and when evaluating a remote script is appropriate.
  • JSON: $.ajax({ url: "/api/employees", method: "GET", dataType: "json" }) expects structured data, such as an object or array, for the success handler.
  • JSONP: $.ajax({ url: "/jsonp-capable-endpoint", method: "GET", dataType: "jsonp" }) requires a server that supports JSONP and returns the callback form expected by the client.
  • Text: $.ajax({ url: "/status", method: "GET", dataType: "text" }) expects a plain string for your code to process or display.

These examples show how each option is paired with a suitable endpoint placeholder. They do not imply that the endpoints exist or that any request was sent.

Parsing, Caching, and Cross-Domain Behavior

Response parsing, cache behavior, and cross-domain handling can depend on the jQuery version and the request context. The examples here do not promise a particular result for malformed or empty JSON, script caching, or conversion between JSON and JSONP. Check the documentation for the version your application uses and confirm that the endpoint supports the selected response type.

JSONP is not interchangeable with ordinary JSON: it requires an endpoint designed to return a callback-wrapped response. A cross-origin request also depends on browser and server behavior; choosing "json" alone does not grant cross-origin access. If a request fails, inspect the response body, response headers, browser console, and server configuration, then compare them with the type your code expects.