Using jQuery to Call ASP.NET AJAX Page Methods – By Example

A commenter recently requested a more in-depth sample
demonstrating the technique I used in my Using
jQuery to Call ASP.NET AJAX Page Methods post. He wanted to see how you
could use jQuery to send the contents of a GridView row to a WebMethod page.

Here are the steps:

Create template columns in the GridView and wrap
the data you want to send to the server in some sort of tag that you can access
via JavaScript

Create a link that calls the JavaScript function
that extracts the data and prepares it for the Ajax request

The most interesting lines of code really are lines 41 – 45 of
the ASPX markup. These lines are where the script formats the variables
appropriately to use the CallPageMethod function that uses jQuery to call the page’s
WebMethod.

I enjoyed the article very much but was little confused with the CallPageMethods internals. I would appreciate if you could please explain the code briefly i.e a clear explanation of the code would prove better for beginners too.

Hi Sr, thanks for your example. I follow your example exactly, but when I run the sample and click the "Select" column the jquery post does not make anything, the events success/fail does not fire.
What am I doing wrong?