$.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

This is another way to do it not using ajax. It uses post and returns a json object.

data = {};
data.standardBagProductId = standardBagProductId.trim();
$.post("StandardBag.aspx/RemoveProductFromStandardBag", data , function(response){
    $(".reload").click();
},"json");

Answer 2

Try changing your post data like this,

 {standardBagProductId: standardBagProductId.trim() }

Answer 3

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"
});

Answer 4

for $.post function second param should not be in "".

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