Why does my Ajax call have an empty POST?

Question

When I submit an Ajax request to save a form, I get an empty request.POST QueryDict. Hopefully I'm just overlooking something due to inexperience with Ajax. Here is the relevant code:

Ajax

<script>
    $(function() {
        [...]
        $(document).ajaxComplete(function() {
            [...]
            $(".inline-save").click(function() {
                    $.ajax({
                        url : '/webApp/saveForm/',
                        type : 'POST',
                        dataType : 'HTML',
                        contentType: 'application/x-www-form-urlencoded;charset=utf-8',
                        success : function(info) {
                            $("#info-display").html(info);
                        }
                    });
                });
            });
        });

The form I intend to save is brought up with another Ajax call, thus the ajaxComplete usage. In my urls.py and views.py, I simply redirect to save_view, which just prints request.POST for now, which outputs <QueryDict: {}> - an empty QueryDict.

What am I missing? Even though there are several similar questions, none that I've found have helped me so far.

... ... ... ... OH. /facepalm Well, at least I'm making this mistake as a newbie and not as someone with experience. :P — ZAD-Man, Aug 19 '14 at 19:52
fyi jquery's [`.post`](http://api.jquery.com/jquery.post/) is a bit cleaner way to write ajax POSTs. — roippi, Aug 19 '14 at 20:19
`contentType: 'application/x-www-form-urlencoded;charset=utf-8'` is not required when using the jquery post method. — Eagllus, Aug 21 '14 at 06:55

score 0 · Answer 1 · answered Aug 19 '14 at 19:58

You can add data : postData to your ajax:

$.ajax({
    url : '/webApp/saveForm/',
    type : 'POST',
    data : postData,     // You need to add the data you want to send here
    dataType : 'HTML',
    contentType: 'application/x-www-form-urlencoded;charset=utf-8',
    success : function(info) {
        $("#info-display").html(info);
    }
});

score 0 · Answer 2 · answered Aug 19 '14 at 20:10

I did not understand your question very well but,try to see this document that explains Ajax with Jquery.

$.ajax({
  type: "POST",
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

Source: http://api.jquery.com/jquery.post/

Try to it different. For example:

  $(".inline-save").click(function() {
        $.ajax({
                        type: "POST",
                        url: "http://xxx.xxx.x.xx:PORT/webApp/saveForm",
                        dataType:'json',
                        data:$(".formName").serialize(),
                        success: function(msg) {
                            alert("Form supposedly saved",msg)
                            $("#info-display").html(info);
                        }
                  });
}

or just add there fields and see if it works for you:

data:$(".formName").serialize(),

or

data:{
   variableName : value,
   variableName2:value2
}

Hope it helps.

Why does my Ajax call have an empty POST?

2 Answers2