Login/Register
ASP .NET: Cannot call Page WebMethod using jQuery
Asked Answered
Solved jqueryasp.net-ajaxwebmethod
G

5

6

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?

Galloway answered 4/5, 2010 at 20:44 Comment(0)
K
6

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);
            }
        });
    }
Kristof answered 4/5, 2010 at 21:28 Comment(1)
Problem fixed! Thanks Code Poet and everyone else who answered. It was two-fold: The dataType was part of the problem, so I gave everyone a vote up who answered on that part. Ultimately, it came down to inadvertently violating the same origin policy, which is why I marked this as the solution. Thanks again everyone. Appreciate it! – Galloway
C
2

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

Cumulonimbus answered 4/5, 2010 at 21:34 Comment(0)
J
1

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"

Jahvist answered 4/5, 2010 at 21:30 Comment(1)
Thanks for sharing! I'll be using this handy little function moving forward. – Galloway
N
0

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

Neogothic answered 4/5, 2010 at 21:7 Comment(1)
-- WebMethod is all that is required on the server side. – Kristof
D
0

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

Desberg answered 4/5, 2010 at 21:12 Comment(4)
-1 and welcome to StackOverflow. The question specifically indicates that jQuery is in use. MsAjax is NOT required to post to a page method. – Kristof
OK fair enough. It sounded to me like he was looking for a way to make it work, and I provided an alternative. I agree that MsAjax is not required to make it work, but it would be available and could be a viable alternative. The question does specifically indicate that jQuery is in use, but no where does it say jQuery HAS to be used. – Desberg
Sorry about that Jeremy. I should have been more clear, but yes, it has to be via jQuery. I'll definitely keep your response in mind though if I decide to go the MsAjax route in the future. – Galloway
I aint mad atcha, just levying some newb tax to get you prepared. You will get the hang of it. As context, consider this: I ask how to solve a problem I am having in C# and you respond 'Hey, you could do this in Ruby, like this...' - I draw this parallel to help you understand why I downvoted you. p.s. don't mind me, i am just an old curmudgeon. – Kristof

© 2022 - 2024 — McMap. All rights reserved.