Update Panel And JQuery ajax

Asp.Net Ajax Update Panel And JQuery ajax

In asp.net we have used update panel but we have lots of article in web regarding update panel is dangerous. In my point of view if we have use update panel according to page design then it’s some extent to fine. UpdatePanels, by design and due to their nature, pass a lot more stuff over the wire than PageMethods. Remember, they pass the changed markup, View State etc over the wire. However, it is always context dependant, is it an issue. Is the Page so big that async post back with UpdatePanel is unbearable? There are also ways to optimize things like reducing the unneeded ViewState, using multiple UpdatePanels to split the page to as-small-as-possible regions which need to be updated using UpdatePanel. E.g updates only the parts which really need to be updated instead of passing everything you have on the Page. Using one UpdatePanel for entire page for example is not wise, if the page can be split up. 

So page method is Page methods allow ASP.NET AJAX pages to directly execute page static method, using JSON (JavaScript Object Notation). JSON is basically a minimalistic version of SOAP, which is perfectly suited for light weight communication between client and server

You can directly call static method using page method for ie

[WebMethod]

public static string GetCurrentDate()

{

  return DateTime.Now.toString();

}

Aspx Page

First you have to enable the page method

<asp:ScriptManager ID="ScriptManager1" runat="server"   EnablePageMethods="true" />

<script language="javascript">

 function UpdateData() {

   PageMethods.GetCurrentDate(OnSucceeded, OnFailed); 

 }

 function OnSucceeded(result, userContext, methodName) {

   $get('lblDisplay').innerHTML = result; 

 }

 function OnFailed(error, userContext, methodName) {

   $get('lblDisplay').innerHTML = "error.";

 }

</script>

<asp:Label runat="server" ID="lblDisplay" Text=" " /><br />

<input type="button" id="btnSubmit" value="Refresh" 

  onclick="UpdateData();" />

This is first approach use ajax in asp.net

2) Jquery and Ajax

jQuery you can also make asynchronous calls to the server and gives you more flexibility while developing your application. Jquery ajax have provided the many method.   You can see and example of jQuery.ajax in the following snippet.

In aspx page we have need  latest jquery refrense

  

                
Employee               

Requests.aspx.cs Page

[WebMethod(true)]

    public static int SendRequest(string empId, string remarks)

    {

        try

        {

            if (HttpContext.Current.Session["GsmSessionUser"] == null)

                return 300;

            {

                int status = databaseFunction to insert the record

                if (status == 1)              return 1;

                else

                    return 0;

            }

            else

            {

                return 2;

            }

        }

        catch (Exception ex)

        {

            return 500;

        }

    }

Similar lots  of method jquery ajax to achive  ajax functionality.

Comparison

UpdatePanel is very easy to use; you really don't have to write any significant code to achieve AJAX, works seamlessly with server controls model. This is achieved by issuing asynchronous post request - so all form elements get posted including view-state. On server side, entire control tree gets loaded and page follows normal life cycle till rendering at which only html from update panel is sent (along with view-state) to client side. So you have large request size, more server load and large response size.

Alternative is to make async server calls, where request would carry only data that is needed for server call. The server would respond with the data needed. Typically, one would use JSON to transfer data to/from server, reducing request and response size. On server side, typically, a script service or page method is used which will do the specific task (as opposed to following a page life cycle) reducing server load.