无法使用jQuery Ajax调用来调用aspx页面Web方法？

Question

Here is my ajax call

$(document).ready(function () {

         $("#btnSubmit").click(function () {
             alert("I am in ?");
             $.ajax({
                 type: "POST",
                 url: "TestNew2.aspx/DisplayData",
                 data: "{}",
                 contentType: "application/x-www-form-urlencoded",
                 dataType: "text",
                 //success: function (msg) {
                 //    // Replace the div's content with the page method's return.
                 //    $("#btnSubmit").text(msg.d);
                 //    alert(msg.d);
                 //}


                 success: function (result, status, xhr) {
                     document.getElementById("lblOutput").innerHTML = xhr.responseText
                 },
                 error: function (xhr, status, error) {
                     alert(xhr.error);
                 }


             });
         });


     });

and my Web method [WebMethod] public static string DisplayData() { return DateTime.Now.ToString(); } [WebMethod] public static string DisplayData() { return DateTime.Now.ToString(); }

Getting aspx page when trying to call web method on aspx page.Here is the jQuery code Can any one point out what may be wrong.Because the web method is not getting called.

Answer 1

Try Like

            $.ajax
                ({
                    url: " URL",

                    data: "{ 'name' : 'DATA'}",

                    dataType: "json",

                    type: "POST",

                    contentType: "application/json; charset=utf-8",                   

                    async: true,

                    dataFilter: function (data) { return data; },

                    success: function (data) 
                    {
                        alert(data);
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert("error");
                    }
                });

OR

 jQuery.ajax({
    type: "POST",
    url: "Login.aspx/checkUserNameAvail",
    contentType: "application/json; charset=utf-8",
    data: "{'iuser':'" + userid + "'}",
    dataType: "xml",
    success: function (msg) {
        $(msg).find("Table").each(function () {
            var username = $(this).find('UserName').text();
            if (username != '') {
                //window.location.replace('/iCalendar.aspx');
                alert('This username already taken..');
                $("#reguser").val('');
                $("#reguser").focus();
            }
            else {
            }
        });
    },
    error: function (d) {
    }
});

.CS

[WebMethod(enableSession: true)]
    [ScriptMethod(ResponseFormat = ResponseFormat.Xml)]
    public static string checkUserNameAvail(string iuser)
    {
        try
        {
            iCalendarClass iC = new iCalendarClass();
            DataSet ds = iC.checkUserNameAvail(iuser);
            return (ds.GetXml());
        }
        catch
        {
            return null;
        }
    }