jQuery Ajax in asp.net

Question

I'm trying to call a static method in c# using jQuery Ajax. I've tried before but now it is not working. I get error status as 200 Ok. Here is my code:

$("#btnSample").live("click", function()
    {
        $.ajax({
                type : "POST"
            ,   data : {}
            ,   url : "jQueryAjax.aspx/SampleMethod"
            ,   contentType : "application/json; charset=utf-8"
            ,   dataType : "json"
            ,   success : function(msg)
            {
                alert("Success : "+msg);
            }
            ,   error : function(error)
            {
                $("#lblSample").text(error.status);
            }
        });
    });

My Server-side code is:

[WebMethod]
public static string SampleMethod()
{
    return "jQuery is Super";
}

aspx for Button:

<input type="button" id="btnSample" runat="server" value="Show What" />

I think it might be good idea to give more details about the server-side. — Yaakov Shoham
– Yaakov Shoham, Commented Jan 28, 2010 at 11:05
There is no exception. The error status and error statusText are 200 and Ok respectively. When the button is clicked, page_load is fired, but the static method(SampleMethod) is not fired. — superachu
– superachu, Commented Jan 28, 2010 at 11:12
Hi again, should have asked in my previous comment. what version of jQuery are you using. I am trying to recreate your issue. I already note that jQuery1.3.2 is not working on my side because of the .live but works with 1.4.1 — Kamal
– Kamal, Commented Jan 28, 2010 at 11:57

Kamal · Accepted Answer · 2010-01-28 13:24:23Z

2

I've recreated your code on my side.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>


    <script src="Js/jquery-1.4.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        $("#btnSample").live("click", function() {
            $.ajax({
                type: "POST"
            , data: {}
            , url: "Default.aspx/SampleMethod"
            , contentType: "application/json; charset=utf-8"
            , dataType: "json"
            , success: function(msg) {
                alert("Success : " + msg.d);
            }
            , error: function(error) {
                $("#lblSample").text(error.status);
            }
            });
        });

    </script>

</head>
<body>
    <form id="form1" runat="server">
    <asp:Label runat="server" ID="lblSample"></asp:Label>
    <input type="button" id="btnSample" runat="server" value="Show What" />
    </form>
</body>
</html>

That's a copy and paste. I've tested it in IE8 and it works fine.

The one change I did make was changing your success output to use msg.d This is so it outputs Success : jQuery is Super. msg would NOT cause a crash - it would just output Success : [object Object] (msg is a object that contains a string called d which the return from the static method is called).

I haven't changed your static method at all

This is in my class (remember Default.aspx)

public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { }

[WebMethod]
public static string SampleMethod()
{
    return "jQuery is Super";
}

}

This is sitting inside my Default.aspx.cs file

I tried messing around to get a 200 OK error and the ONLY time I managed this was when I had

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

That has a space between the / and json.

But that isn't in your question. Maybe it is sitting in your code that way and you fixed it in the question?

answered Jan 28, 2010 at 13:24

Kamal

2,5222 gold badges35 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

superachu Over a year ago

The thing is, I'm using IE6. I guess it doesn't works in IE6. Is it so?

Kamal Over a year ago

Possibly. But unfortunately I do not have any pc here with IE 6 to test the theory on. Do you have a machine with anything other than IE 6. Maybe firefox?

superachu Over a year ago

I think the problem is with IE6. It works perfectly in IE7+ and Mozilla Firefox. In IE6, it doesn't work as far as I've seen.

brheal · Accepted Answer · 2010-01-28 14:35:24Z

2

One thing I see different about your script than the way I use it is wrapping the {} in the data part with quotes. Try this:

, data: "{}"

Also, This is a good article with some jquery ajax caveats: http://encosia.com/2008/06/05/3-mistakes-to-avoid-when-using-jquery-with-aspnet-ajax/

answered Jan 28, 2010 at 14:35

brheal

1,2378 silver badges14 bronze badges

1 Comment

Kamal Over a year ago

I noticed that as well. But I tried it without the quotes and works just as well.

Ariel · Accepted Answer · 2010-01-28 14:54:33Z

1

Your button is posting back instead of calling the click event. To stop the unintentional postback add e.preventDefault to your click handler. I'd also suggest not using a server side control (ie removing the runat=server) unless absolutely necessary. It just adds unneeded overhead.

answered Jan 28, 2010 at 14:54

Ariel

4,5102 gold badges24 silver badges23 bronze badges

1 Comment

superachu Over a year ago

The code which I've written is correct. It only doesn't works in IE6.

Collectives™ on Stack Overflow

jQuery Ajax in asp.net

3 Answers 3

3 Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related