Ajax call not hitting code behind c# method

Question

I have a jQuery ajax call

 <script type="text/javascript">
        $(document).ready(function () {
            $('#MainContent_minuteBooks').click(function (e) {

                e.preventDefault();

                $.ajax({
                    type: "GET",
                    url: "MainView.aspx/GetPageTypes",
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        console.log("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
                    },
                    success: function (response) {
                        console.log("--" + JSON.stringify(response));
                    }
                });

            });
        });
    </script>

This should call my code behind WebMethod

        [WebMethod]
        public static string GetPageTypes()
        {
            List<string> pages = new List<string>();
            string html = "";
            Console.WriteLine(book.Count);


            foreach(MinuteBookPage mbp in book)
            {
                if (!pages.Contains(mbp.Class)) { pages.Add(mbp.Class); };
            }

            foreach(string s in pages)
            {
                html += "<div class='page' style='border: solid 2px red'><p>" + s + "</p></div>";
            }
            Console.WriteLine(html);

            return html;

        }

I have breakpoints set on the method, as well as a Console.WriteLine that should be display, the breakpoints are not hit, and the console does not output anything

I am lead to believe that my method is not being called

In the network tab this is displayed, First call , there is a second call after this 301 response, and it just returns the page html/javascript

Upon success the ajax call returns the html and JavaScript markup for the page i am on

I have looked at this link Pagemethods in asp.net but it seems outdated, and all other resources ive looked at dont seem to follow what it outlines

Answer 1

Thanks to @Dortimer for pointing me to this post, and helping me work out the issue.

How to properly make an ajax call with webforms

I ended up with the following code

Ajax call

<script type="text/javascript">
        $(document).ready(function () {
            $('#MainContent_minuteBooks').click(function () {
                console.log("inside click");

                $.ajax({
                    type: 'POST',
                    url: '<%= ResolveUrl("~/MainView.aspx/GetPageTypes") %>',
                    data: '{ }',
                    contentType: 'application/json; charset=utf-8',
                    dataType: 'json',
                    success: function (msg) {
                        console.log(msg)
                    }
                });
                return false;
            });
        });
    </script>

Also i had to turn off RedirectMode inside of the RouteConfig.cs file

        public static void RegisterRoutes(RouteCollection routes)
        {
            var settings = new FriendlyUrlSettings();
            settings.AutoRedirectMode = RedirectMode.Off;
            routes.EnableFriendlyUrls(settings);
        }