CODEWITHSUNDEEP
jqueryajaxnull
Tom
Tom

Reputation: 542

Cannot pass null to server using jQuery AJAX. Value received at the server is the string "null"

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
}

Upvotes: 18

Views: 20744

Answers (4)

Fabrice
Fabrice

Reputation: 3100

You can use undefined instead of null.

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

Upvotes: 12

jasongarber
jasongarber

Reputation: 2206

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

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

Upvotes: 6

Oly
Oly

Reputation: 31

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.

Upvotes: 1

Tgr
Tgr

Reputation: 28220

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.)

Upvotes: 15

Related Questions