CODEWITHSUNDEEP
jqueryasp.net-ajaxwebmethod
John
John

Reputation: 9456

ASP .NET: Cannot call Page WebMethod using jQuery

I created a WebMethod in the code-behind file of my page as such:

[System.Web.Services.WebMethod()]
public static string Test()
{
    return "TEST";
}

I created the following HTML page to test it out:

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"/></script>
    <script type="text/javascript">
        function test() {            
            $.ajax({
                type: "POST",
                url: "http://localhost/TestApp/TestPage.aspx/Test",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "text",
                success: function(msg) {
                    alert(msg.d);
                }
            });
        }
    </script>
</head>
<body>
    <button onclick="test();">Click Me</button>
</body>
</html>

When I click the button, the AJAX fires off, but nothing is returned. When I debug my code, the method Test() doesn't even get called. Any ideas?

Upvotes: 6

Views: 10844

Answers (5)

James Westgate
James Westgate

Reputation: 11464

I think datatype should be "json". Add an error function to see what error status you get back ie 404 not found , 500 server error etc etc

Upvotes: 2

Petr Kaleta
Petr Kaleta

Reputation: 51

I made this javascript function to call WebMethods using jQuery:

function pageMethod(fn, params, successFn, errorFn) {  
    var pagePath = window.location.pathname;  

    var jsonData = $.toJSON(params);

    $.ajax({  
        type: "POST",  
        url: pagePath + "/" + fn,  
        contentType: "application/json; charset=utf-8",  
        data: jsonData,  
        dataType: "json",  
        success: successFn,  
        error: errorFn  
    });
}

That $.toJson serialization is realized by jquery.json-1.3 plugin.

And as you can see, dataType must be "json"

Upvotes: 1

Sky Sanders
Sky Sanders

Reputation: 37104

try

url: "TestPage.aspx/Test"

or whatever relative url that will hit your page.

You may be inadvertently violating same origin policy.

Also, although you are not there yet, you are expecting a d: wrapped object. As it is you are just going to get a string.

This should get you where you want to go.

    function test() {            
        $.ajax({
            type: "POST",
            url: "TestPage.aspx/Test",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                alert(msg.d);
            }
        });
    }

Upvotes: 6

Jeremy
Jeremy

Reputation: 363

If the PageMethods are properly registered on your page, you should be able to call them with a Microsoft registered object called PageMethods.

Your javascript should run after the aspx page has loaded all the Microsoft specific libraries. When those are loaded, you could call your PageMethod this way:

PageMethods.Test(function() OnSucceeded{}, function() OnFailed{});

Here is a link to better examples:

http://www.junasoftware.com/blog/using-jquery-ajax-and-page-methods-with-a-asp.net-webservice.aspx

If you aren't already, I highly recommend using Firebug to help debug these client-side calls. Firebug will give you all the info you need to determine what is really going on.

getfirebug.com

Upvotes: 0

CurlyFro
CurlyFro

Reputation: 1882

you need to set Test() to accept/allow POST

Upvotes: 0

Related Questions