$.post vs $.ajax

Question

I'm trying to use the $.post method to call a web service, I've got it working using the $.ajax method:

$.ajax({
    type: "POST",
    url: "StandardBag.aspx/RemoveProductFromStandardBag",
    data: "{'standardBagProductId': '" + standardBagProductId.trim() + "' }",
    success: function(){
                 $((".reload")).click();
             },
    dataType: "json",
    contentType: "application/json"
});

But when I move the same method into the $.post method, it will not work:

$.post("StandardBag.aspx/RemoveProductFromStandardBag",
    "{'standardBagProductId': '" + standardBagProductId.trim() + "' }",
    function () { $((".reload")).click(); },
    "json"
);

What am I missing?

Answer 1

It doesn't work because in your $.post method you cannot set the content type of the request to application/json. So it is not possible to invoke an ASP.NET PageMethod using $.post because an ASP.NET PageMethod requires a JSON request. You will have to use $.ajax.

I would just modify the data in order to ensure that it is properly JSON encoded:

$.ajax({
    type: "POST",
    url: "StandardBag.aspx/RemoveProductFromStandardBag",
    data: JSON.stringify({ standardBagProductId: standardBagProductId.trim() }),
    success: function() {
        $(".reload").click();
    },
    dataType: "json",
    contentType: "application/json"
});