Jquery AJAX with ASP.NET WebMethod Returning Entire Page

Question

I'm doing some simple tests (in preparation for a larger project) to call an ASP.NET WebMethod using JQuery AJAX. In my example, my WebMethod returns a simple string. However, when I attempt to call it using JQuery, I get the entire HTML page content returned instead of just my string. What am I missing?

Client Side :

$(document).ready(function ready() {
        $("#MyButton").click(function clicked(e) {
            $.post("Default.aspx/TestMethod",
                {name:"Bob"},
                function(msg) {
                    alert("Data Recieved: " + msg);
                },
                "html"
            );
        });
    });

Server Side:

using System;
using System.Web.Services;

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

        }

        [WebMethod]
        public static string TestMethod(string name)
        {
            return "The value submitted was " + name;
        }
    }
}

My suggestion to anyone having these types of problems: please double check the routing. — QMaster
– QMaster, Commented Jun 24, 2023 at 23:38

Community · Accepted Answer · 2016-07-21 15:57:54Z

22

Check out this link. I used some of his other posts to calll WCF service with success. Be sure to check out the related articles:

http://encosia.com/2008/05/29/using-jquery-to-directly-call-aspnet-ajax-page-methods/

Read through the article but its essentially:

  $("#Result").click(function() {
    $.ajax({
      type: "POST",
      url: "Default.aspx/GetDate",
      data: "{}",
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: function(msg) {
        $("#Result").text(msg.d);
      }
    });
});

edited Jul 21, 2016 at 15:57

CommunityBot

11 silver badge

answered Dec 8, 2008 at 6:03

JoshBerke

67.3k25 gold badges131 silver badges170 bronze badges

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

3 Comments

Nathan Over a year ago

Make sure your web.config contains something equivalent to this, depending on your version:

<configuration> 		<system.web> 			<httpModules> 				<add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 			</httpModules> 		</system.web> 	</configuration>

Yves A Martin Over a year ago

The key part of this is the line contentType: "application/json; charset=utf-8" without that line it will return HTML.

劉鎮瑲 Over a year ago

@Nathan I stock in the same problem as the OP about a week, and your answer really help me a lot. Finally I can move on my project. I am really appreciate. Thank you.

Dana · Accepted Answer · 2008-12-08 14:17:14Z

9

I think I was getting confused with the "type" parameter in JQuery's $.post command. After talking to some folks, it seems that the return type for calling a WebMethod MUST be "json". I was trying to use "html". Once I changed it to "json" and then everything worked like normal. So apparently, a method decorated with [WebMethod] returns JSON only, and that's where my hangup was.

Thanks for your replies guys.

answered Dec 8, 2008 at 14:17

Dana

1,4603 gold badges14 silver badges26 bronze badges

1 Comment

Jagd Over a year ago

Yeah, this was getting me as well. Thanks for the info!

rajesh pillai · Accepted Answer · 2008-12-08 06:08:37Z

3

Try changing the last parameter "html" to "text". This parameter specifies the type of data to be returned.

edited Dec 8, 2008 at 6:08

answered Dec 8, 2008 at 5:28

rajesh pillai

8,1267 gold badges46 silver badges60 bronze badges

2 Comments

Dana Over a year ago

The problem is, the method is never called. the AJAX call is simply receiving the entire page, rendered just as the browser would see it.

rajesh pillai Over a year ago

can you try changing the "html" to "text".?

BernieSF · Accepted Answer · 2017-02-03 17:28:13Z

0

I had the exactly the same problem: WebMethod returned the entire HTML page instead the intended data. For me, the solution came from changing inside ~/App_Start/RouteConfig.cs the following line:

settings.AutoRedirectMode = RedirectMode.Permanent;

to

settings.AutoRedirectMode = RedirectMode.Off;

answered Feb 3, 2017 at 17:28

BernieSF

1,8582 gold badges31 silver badges46 bronze badges

Collectives™ on Stack Overflow

Jquery AJAX with ASP.NET WebMethod Returning Entire Page

4 Answers 4

3 Comments

1 Comment

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related