Cannot pass null to server using jQuery AJAX. Valu

Question

I am converting a javascript/php/ajax application to use jQuery to ensure compatibility with browsers other than Firefox.

I am having trouble passing true, false, and null values using jQuery's ajax function.

Javascript code:

$.ajax
(
   {
      url     : <server_url>,
      dataType: 'json',
      type    : 'POST',
      success : receiveAjaxMessage,
      data:
      {
         valueTrue : true,
         valueFalse: false,
         valueNull : null
      }
   }
);

PHP code:

var_dump($_POST);

Server output:

array(3) {
  ["valueTrue"]=>
  string(4) "true"
  ["valueFalse"]=>
  string(5) "false"
  ["valueNull"]=>
  string(4) "null"
}

The problem is that the null, true, and false values are being converted to strings.

The Javascript AJAX code currently in use passes null, true, and false correctly but only works in Firefox.

Does anyone know how to solve this problem using jQuery?

---

Here is some working code (not using jQuery) to compare with the not-working code given above.

Javascript Code:

ajaxPort.send
(
   <server_url>,
   {
      valueTrue : true,
      valueFalse: false,
      valueNull : null
   }
);

PHP code:

var_dump(json_decode(file_get_contents('php://input'), true));

Server output:

array(3) {
  ["valueTrue"]=>
  bool(true)
  ["valueFalse"]=>
  bool(false)
  ["valueNull"]=>
  NULL
}

Note that the null, true, and false values are correctly received.

Note also that in the second method the $_POST array is not used in the PHP code. I think this is the key to the problem, but I cannot find a way to replicate this behavior using jQuery.

---

This section was added after the answer below was accepted.

Here is a corrected version of the original code.

Javascript code:

$.ajax
(
   {
      url     : <server_url>,
      dataType: 'json',
      type    : 'POST',
      success : receiveAjaxMessage,
      data    : JSON.stringify
      (
         {
            valueTrue : true,
            valueFalse: false,
            valueNull : null
         }
      )
   }
);

PHP code:

var_dump(json_decode(file_get_contents('php://input'), true));

Server output:

array(3) {
  ["valueTrue"]=>
  bool(true)
  ["valueFalse"]=>
  bool(false)
  ["valueNull"]=>
  NULL
}

Answer 1

You can use undefined instead of null.

data: {
  valueTrue : true,
  valueFalse: false,
  valueNull : undefined
}

Answer 2

For anyone that comes across this, the bug is fixed in jQuery 1.8

https://github.com/jquery/jquery/pull/714

Answer 3

I would expect it to send query params as valueNull= rather than valueNull=null which is my experience.

If you are doing REST with JSON you still need to send query params for GETS and you must not convert all your GETS to POSTS to get round this issue.

Answer 4

What would you expect? You are sending this values as POST parameters, which are simple text strings. If you want type-safe transfer, use some sort of encoding, such as JSON. (Which is not what dataType does - that refers to the response from the server.)