user2406735
user2406735

Reputation: 245

Ajax check sent data

I am trying to send data with ajax. How can I see what is sent in data? I do not want to check on server side, but I want to test it for example in firebug, or alert. I want to see how data outputs, what will server side developer get with this ajax? This order is a string with numbers separated with coma 1,5,6,8:

$.ajax({
  type: 'POST',
  url: 'server file url',
  data: '{itemOrder: \'' + order + '\'}',
  contentType: 'application/json; charset=utf-8',
  dataType: 'json',
  success: function () {
  alert("success");
},
       error: function (xhr, status, error) {
  alert(status);
  alert(xhr.responseText);
}
});

Upvotes: 1

Views: 9196

Answers (4)

Miltons
Miltons

Reputation: 1

You can use the developer tools found in every browser. In Chrome right click on the top menu and select developer tools on the menu that pops. Chose console when you are in developer tools then in the success function of your Ajax call console.log() your data

Upvotes: 0

Adil H. Raza
Adil H. Raza

Reputation: 1701

Just so you know you don't have to console.log or alert, you can do that if you prefer but you can check what is being sent to the server in the Network tab of your dev tools. See screenshot:

enter image description here

Select your ajax call and click Headers and click view source in request payload to see exact json object being sent.

Upvotes: 2

lase
lase

Reputation: 2634

You could assign a var dataToSend equal to what you are preparing to send, and output it via console.log(dataToSend) or alert(dataToSend) right before your ajax call. Then in your call, just put it in place of what you had previously:

        $.ajax({
             type: 'POST',
             url: 'server file url',
             data: dataToSend,
             contentType: 'application/json; charset=utf-8',
             dataType: 'json',
             success: function () {
                 alert("success");
             },
             error: function (xhr, status, error) {
                 alert(status);
                 alert(xhr.responseText);
             }
         });

You could assign the variables as such:

var order = [1, 5, 6, 8];
var dataToSend = "{itemOrder:'" + order + "'}";
console.log(dataToSend);

Upvotes: 1

vimes1984
vimes1984

Reputation: 1693

use the network tools in chrome dev tools:

LINK Right click on the top bar and select TYPE and you should see the json requests and sends...

Look at watching the chrome dev tools videos presented by Paul irsh and Addy Osamni called: FIRST VID

If you log to console the "order" var it will dump in the console what it's trying to sen on success. the other way to do it would be to create a function out of the ajax call and then echo the whole function in the console.

 $.ajax({
                 type: 'POST',
                 url: 'server file url',
                 data: '{itemOrder: \'' + order + '\'}',
                 contentType: 'application/json; charset=utf-8',
                 dataType: 'json',
                 success: function () {
                     alert("success");
console.log(order);
                 },
                 error: function (xhr, status, error) {
                     alert(status);
                     alert(xhr.responseText);
                 }
             });

Upvotes: 2

Related Questions