Making .NET Ajax request using jQuery

Question

I am just wondering that, is there anyway to make an Ajax request using jquery ("$.ajax") and making partial rendering without using the .NET Ajax framework (without script manager).

I have tried this before, but it's executing the page_load every time and not reaching to the pagemethod.

function doAsync() 
{ 
   jQuery.ajax({ 
   type: "POST", 
   url: "/WebForm1.aspx/testMethod", 
   error: function (xhr, status, error) { alert(status); }, 
   success: function (response) { alert('suc'); }
   )};
}

 [WebMethod] 
 public static void testMethod() 
 {
     //server side code 
 }

Is there anything wrong here?

Thanks!

Are you asking if you can do an ajax request to asp.net and return some like html or data? If so yes you can what are you using though asp.net webforms or asp.net mvc? — chobo2
– chobo2, Commented Jan 20, 2010 at 3:48
yeah, correct, and I am using webform. I was trying to achieve this by using $.ajax, but I am getting whole page refreshed and got some error. — Thurein
– Thurein, Commented Jan 20, 2010 at 3:49
I don't think you can stick a webMethod in an asp.net webform(if you can you need to do some reworking). As I mentioned in my post earlier is that all web form pages have a page life cycle that it goes through. It always goes through the page_load you can't stop it. You can have an if statement to stop code from running but you can't stop it. YOu can't have in your code behind just one method and go to it. You have to go through the entire page lifecyle. If you want to do it the webservice way then make a separate webservice project. — chobo2
– chobo2, Commented Jan 20, 2010 at 6:04
Ok I saw you got that from Gabriel's post. I never seen that before so I can't comment on how it will work. The one thing that I notice from that tutorial is they got the "ScriptManager" so I don't know if that has any effect on it. — chobo2
– chobo2, Commented Jan 20, 2010 at 6:15

Dave Ward · Accepted Answer · 2010-01-20 06:24:37Z

15

What you're missing is the content-type. To make a request to a page method, you must make the call exactly like this:

$.ajax({
  type: "POST",
  url: "/WebForm1.aspx/testMethod",
  data: "{}",
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function(msg) {
    // Do something interesting here.
  }
});

See this for more detailed information: http://encosia.com/2008/05/29/using-jquery-to-directly-call-aspnet-ajax-page-methods/

answered Jan 20, 2010 at 6:24

Dave Ward

60.7k14 gold badges119 silver badges134 bronze badges

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

7 Comments

Thurein Over a year ago

I have added the content-type but its still executing the page_load method and not reaching to the web method in my aspx code behind.

Dave Ward Over a year ago

Be sure that you have your web.config properly configured for ASP.NET AJAX. You definitely can call page methods in this manner, without running the page through its life cycle.

Thurein Over a year ago

Now i think, we got the point, because my site is not ajax enabled, and that was also the reason I was trying to use the jquery ajax call, any suggestion. Thanks

Dave Ward Over a year ago

What version of .NET are you running?

MrDustpan Over a year ago

Yeah, I think it's your web.config that's missing the stuff it needs to do ASP.NET Ajax. Try this: switch your form to Design View, and drag a Script Manager control onto it. Then switch back to Source View and remove the Script Manager. VS will update your config file when you add that control to your form.

|

Cyril Gandon · Accepted Answer · 2011-07-25 07:42:06Z

4

Consuming Web Services through jQuery Ajax methods

Consuming Methods residing on an Aspx Page through jQuery Ajax Methods

Actually the articles above are the ones that taught me jQuery Ajax truly. If it is your first time, don't worry ! They are really easy to comprehend.

jQuery Ajax Methods :

ajax() : The low-level ajax method for every ajax call
post() : Specialized for post methods
get() : Specialized for get methods
getJSON(): Specialized for get json type result set
load() : To Inject html portion into html element on the page.

edited Jul 25, 2011 at 7:42

Cyril Gandon

17.1k15 gold badges84 silver badges124 bronze badges

answered Jan 20, 2010 at 3:54

Tarik

82.2k86 gold badges243 silver badges351 bronze badges

Comments

rahul · Accepted Answer · 2010-01-20 04:25:43Z

2

Yes, you can.

You can use either $.ajax or $.get or $.post for issuing a request to a server.

and in the callback function you can get the data in many formats; either XML, plain text, HTML or as JSON.

Example

$.ajax ( {
    type    :   "GET", 
    url     :   "MyPage.aspx",
    data    :   "action=Action&name=Test",
    success :   function ( msg ) {
        ParseSuccess ( msg );
        },
    error   :   function ( msg ) {
        ParseError ( msg );
        }
    });

edited Jan 20, 2010 at 4:25

answered Jan 20, 2010 at 4:20

rahul

188k50 gold badges239 silver badges266 bronze badges

Comments

Gabriel McAdams · Accepted Answer · 2010-01-20 04:19:51Z

0

You can do this using page methods. Basically, you create a static method and add the WebMethod attribute and use it as if it were a web service method.

answered Jan 20, 2010 at 4:19

Gabriel McAdams

58.5k12 gold badges67 silver badges78 bronze badges

Comments

chobo2 · Accepted Answer · 2010-01-20 04:08:17Z

-7

Well how webforms is setup you can't actually get to the code behind file since that would require you to go through the entire page life cycle. You can't just have some method in your code behind file and try to just target it.

So you need to either make a web service or what I like to do is use a generic handler.

So you would go to add - add new item - generic handler(.ashx)

It would generate a file like this(the follow code has some more stuff in it that is not generated by default).

<%@ WebHandler Language="C#" Class="FileNameOfGenricHandler" %>

using System;
using System.Web;

public class FileNameOfGenricHandler: IHttpHandler {

    public void ProcessRequest (HttpContext context) {

        // use context.Request to get your parameter fields that you send through ajax.
        int ID =Convert.ToInt32(context.Request["sendID"]);

        // do something with the variable you sent.

       // return it as a string - respone is just a string of anything could be "hi"
       context.Response.ContentType = "text/plain";
       context.Response.Write(response);

    }

    public bool IsReusable {
        get {
            return false;
        }
    }

}

On jquery side

  // Post to the path like this ../FolderName/FolderName/FileName.ashx(or whatever you stuck your generic handler file).
    $.post('../FolderName/FileNameOfGenricHandler.ashx', { sendID: id }, function(response)
                {
                     alert(response)
});

One downside with the generic handler though is for every different ajax request you want to make you will need its own generic handler. So if you want to create a user, delete a user and update a user through ajax you will have to have 3 generic handlers.

Here is a similar tutorial I used.

http://sites.google.com/site/spyderhoodcommunity/tech-stuff/usingjqueryinaspnetappswithhttphandlersashx

edited Jan 20, 2010 at 4:08

answered Jan 20, 2010 at 3:51

chobo2

86.2k211 gold badges554 silver badges867 bronze badges

6 Comments

Thurein Over a year ago

This is correct, we can't just reach a method, it will go through the whole page cycle.

chobo2 Over a year ago

Hence why I am using a generic handler. It is different the an .aspx page it does not have a life cycle. In the case I am using it as. It is one method in the file. That way you can do exactly what you need. If you don't like the idea of making many generic files. Make a web service application in your project. Make all your methods in this web service application and do all your ajax requests to this webservice and its methods.

Dave Ward Over a year ago

That's not correct. Though its code resides in the code-behind file for a given ASPX page, the page life cycle isn't executed when you call an ASP.NET AJAX "page method". For all intents and purposes, page methods are shorthand for ASMX ScriptServices.

Tarik Over a year ago

You can use [WebMethod] attribute to reach any method on the Aspx page. Or you can use different ways and Dave Ward at Encosia talks about almost all the cool ways to do so.

chobo2 Over a year ago

First I don't know why I got marked down. I don't know if it is because I said you can't stop the page life cycle or if you guys don't like my way of doing it. The ASMX ScriptService seems to always need the ScriptManager(correct me if I am wrong) what "Thurein" asked not to use. That makes total sense since if I am using jquery I personally don't want to have the ScriptManager in my code either since I probably won't be using the asp.net ajax stuff so I think it is more baggage.

|

Collectives™ on Stack Overflow

Making .NET Ajax request using jQuery

5 Answers 5

7 Comments

Comments

Comments

Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

7 Comments

Comments

Comments

Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related