Web method not called from ajax post

I am trying to call a method as web method from ajax like:

$.ajax({
                    url: 'LifeStyleManager.aspx/AddSelfEntry',
                    method: "POST",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    data: angular.toJson(categories),
                    //data: angular.copy(categories)

also tried data as "{'items' : '" + angular.toJson(categories) + "'}"

which is serialized as

{
    "items": "[{\"name\":\"Fruits\",\"metrics\":\"cups\",\"entry\":0,\"recommended\":true,\"color\":\"#989898\"},{\"name\":\"Vegetables\",\"metrics\":\"cups\",\"entry\":1,\"recommended\":true,\"color\":\"#37A0BC\"},{\"name\":\"Whole Grains\",\"metrics\":\"cups\",\"entry\":1,\"recommended\":true,\"color\":\"#37A0BC\"},{\"name\":\"Fast Foods\",\"metrics\":\"times\",\"entry\":0,\"recommended\":false,\"color\":\"#989898\"},{\"name\":\"Sweets\",\"metrics\":\"times\",\"entry\":0,\"recommended\":false,\"color\":\"#989898\"},{\"name\":\"Sugary Drinks\",\"metrics\":\"times\",\"entry\":0,\"recommended\":false,\"color\":\"#989898\"}]"
}

Here categories is serialized as

 [
    {
        "name": "Fruits",
        "metrics": "cups",
        "entry": 0,
        "recommended": true,
        "color": "#989898"
    },
    {
        "name": "Vegetables",
        "metrics": "cups",
        "entry": 1,
        "recommended": true,
        "color": "#37A0BC"
    }
]

Webmethod is like:

        [WebMethod(true)]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public static string AddSelfEntry(List<Entry> items)
        {

Here entry is

public class Entry
        {
            public string name;
            public string metrics;
            public int entry;
            public bool recommended;
            public string color;

        }

I am getting error at console:

enter image description here

No breakpoint hit at webmethod in debugmode.

Update: I am calling ajax from another html page not aspx page where web method sits in code-behind. Is it be the cause?

Please help where I am wrong?


ANSWERS:


What is your jQuery version?

type (default: 'GET')

Type: String

An alias for method.

You should use type if you're using versions of jQuery prior to 1.9.0.

Instead of method, try type: "POST" in your AJAX.



 MORE:


 ? Async Function Not Getting Called
 ? Async Function Not Getting Called
 ? Async Function Not Getting Called
 ? Calling async method and TaskScheduler in async/await
 ? Visual Studio throwing an error on called async function from test code
 ? Pair items in a list by their type and display in the view in one loop
 ? Pair items in a list by their type and display in the view in one loop
 ? Pair items in a list by their type and display in the view in one loop
 ? ASP.NET MVC: How to display strongly typed view model, containing list of items, which also contain list of items?
 ? Convert a list of key/value pairs to datatable