Nested ajax call, postbacks on first response

Question

I am having a very strange issue with nested AJAX calls. The success of the first postbacks the entire page and as a result the second AJAX call success dosen't fire. I happen to be very confused with this. Below is what I'm trying to do: Calling ajaxMethod() on button click:

Page1.aspx asp button:

<asp:Button ID="btnGet" runat="server" Text="Get" OnClientClick="ajaxMethod();" />

JavaScript:

function ajaxMethod() {           
    var txtvalue = "123";

    $.ajax({
        type: "POST",
        url: "Page1.aspx/Method1",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: "{data:'" + txtvalue + "'}"
    }).done(function (response) {
        ajaxMethod2(response);
    });
}

function ajaxMethod2(response) {
    if (response.d == "success") {
        var ddlVacancyID = 12;

        $.ajax({
            type: "POST",
            url: "Page1.aspx/Method2",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            data: "{vacancyId:'" + ddlVacancyID + "'}"        
        }).done(function (response) {
            console.log('res2');
            ajaxMethod3(response);
        });
    } else {
        $("#<%=lblMsg.ClientID%>").text(response.d)
    }
}

function ajaxMethod3(response) {
    console.log('response received');
}

Below is my aspx.cs code:

[WebMethod]
public static string Method1(string data)
{
  return "success";
}

[WebMethod]
public static string Method2(int vacancyId)
{
  return "success";
}

A more strange issue is that it works fine when I debug it via F11, while without debugging it jut runs the server side methods without catching the response on the client side.

Please pardon my ignorance towards the language, as I'm a newbie to it. Also note, that I've tried with success as well as complete, no luck.

Answer 1

Add a return false in your asp button to disable the ASP.NET PostBack:

<asp:Button ID="btnGet" runat="server" Text="Get" 
            OnClientClick="ajaxMethod();return false;" />