Sending a JSON POST request via AJAX

Question

I'm using POST to submit data to the server, this error appears in the console:

POST localhost/myProject/webapp/setAccount 400 (Required String parameter 'accountID' is not present)

The user will select from a combo box an account ID and this is what should be passed in the post.

Here is my code:

accountSelected: function () {

 var accountSelected = $("#accountcombobox").val();
 console.log("Selected Account: " + accountSelected);
     var myUrl = "webapp/setAccount";

     $.ajax({
         url: myUrl,
         type: "POST",
         data: accountSelected,
         dataType: "json",
         contentType: "application/json"
            })
         .done(function (data) {
         console.log("Response " + JSON.stringify(data));
         })
        }

The first console.log shows the selected account ID as expected so i know the value is correct. I want to pass this value to the POST request, which is what i thought i was doing but cannot seem to get it to work.

EDIT

Thanks for the responses but none of the answers seem to be working for me, still the same error.

I'm also using Marionette and Backbone, could this effect it?

missing semicolon and already getting value has json then no neet to stringify it — kamesh, Feb 28 '14 at 12:15
What does the first console.log actually output? Can you put your code on JSFiddle? — Alex, Feb 28 '14 at 14:53

score -1 · Answer 1 · answered Feb 28 '14 at 12:13

-1

Try this,

data:{ accountSelected: accountSelected},

AND,

console.log("Response " + data); //removed JSON.stringify

in webapp/setAccount,

 echo  $_POST['accountSelected'];

answered Feb 28 '14 at 12:13

Krish R

22,583
7
50
59

None of these are working for me - same error, i'm also using Backbone.js and Marionette, is this something that could be effecting it? – Hagbard Feb 28 '14 at 13:47

Alex · Answer 2 · 2014-02-28T14:03:35.397

-2

Your data should be in key: value form, so:

Edit: changed to success


$.ajax({
         url: myUrl,
         type: "POST",
         data:{
             accountID: accountSelected
         },
         dataType: "json",
         contentType: "application/json",
         success: function(data)
         {
                console.log("Response " +data.accountSelected);
         }
});

edited Feb 28 '14 at 14:03

answered Feb 28 '14 at 12:15

Alex

7,320
1
18
31

Thanks but still getting the exact same error, anything else i could try? – Hagbard Feb 28 '14 at 13:30
Try the code in my edit (remove the .done bit) and see what happens – Alex Feb 28 '14 at 14:03
Same error i'm afraid - i'm using Backbone and Marionette - could that be causing issues? If i change: data:{accountID:"Full"} i no longer get the error - but obviously it needs to be linked to the combo box – Hagbard Feb 28 '14 at 14:24
No. With `contentType: "application/json"` `data` needs to be a string of JSON, not an object. – Quentin Jun 12 '16 at 14:47

Selva · Answer 3 · 2014-02-28T12:50:00.020

-2

accountSelected: function () {

 var accountSelected = $("#accountcombobox").val();
 console.log("Selected Account: " + accountSelected);
     var myUrl = "webapp/setAccount";

     $.ajax({
         url: myUrl,
         type: "POST",
         data: "accountID="+accountSelected,
         dataType: "json",
         contentType: "application/json",
         success: function(result) {
             console.log("Response " + JSON.stringify(result));
          },
      error : function(request, textStatus, errorThrown) {
        alert('textStatus ' + textStatus);
        alert('errorThrown ' + errorThrown);
       }

          });
        }

edited Feb 28 '14 at 12:50

answered Feb 28 '14 at 12:42

Selva

338
2
12

`"accountID="+accountSelected,` is (or would be if you applied proper escaping) URL encoded data. It doesn't match `contentType: "application/json",`. – Quentin Jun 12 '16 at 14:46
@Quentin you commented for few answers that they are incorrect. Can you provide correct answer please? Coz it's not workign for me too :( – Bogdan Mart Nov 10 '16 at 17:52
1

@BogdanMart — Do you see the big yellow "This question already has an answer" box at the top? Click the link. – Quentin Nov 10 '16 at 19:31

score -3 · Answer 4 · answered Feb 28 '14 at 12:19

-3

No need to use JSON.stringify coz you already mentioned dataType:'json' so try this

$.ajax({
     url: myUrl,
     type: "POST",
     data: { accountSelected: accountSelected},
     dataType: "json",
     contentType: "application/json"
        })
     .done(function (data) {
     console.log("Response " +data.accountSelected);
     });

answered Feb 28 '14 at 12:19

kamesh

2,374
3
25
33

2

This is incorrect, the JQuery documentation states that 'dataType' is the server's expected return type. – KyleM Oct 19 '15 at 20:33

Sending a JSON POST request via AJAX

4 Answers4