Why I get null values after a successful upload using JSON? - json

Question

I need to upload some data on the server using JQuery 1.5.2. These data must be a base64 encoded image, float value and an integer value. Here is my code:
Updated code:
$.ajax({
type: "POST",
datatype: "json",
url: "http://myURL.json",
data: { id: id, image: "jhbjh", lat: 2.6, lng: 3.4},
success: function () {
alert('Successfully uploaded');
},
error: function (jqXHR, textStatus, errorThrown) {
alert('Error on upload: ' + textStatus + " thrown " + errorThrown);
}
});
The only parameter that is successfully uploaded is the integer value id which seems weird to me but the rest of the values are null on the server. I tried to change the values manually for testing reasons (as seen in the code above) but I still get null values. I get null values when my data looks like :
data: { id: id, image: encodedImage, lat: latitude, lng: longitude},
The server's developer insists that the null values are problem of my code and that the server works fine after several testings. Where is my error? Can you please provide your answers with part of code for an example to me?

Answer 1

You have a few errors, first, why are you sending json? That's quite rare to actually send json to a web server. So just remove the line with contentType completely. (Unless you really do send json, in which case you will need some additional code.)
Second you can't send an image via ajax. I assume by image you mean a file uploaded by the user. Unless you only need new browser support, in which case there is a file API you can use via ajax.
If you need to upload a file you have to do it via the hidden iframe method. Use the jQuery Form Plugin to make this easy for you.
If you really are sending json, you will need to encode it yourself into a string and also include processData: false.