Explicit Post Back to Server Using JavaScript

This article is intended for those with a basic understanding of ASP.Net Server Controls and JavaScript.

The agenda is simple; we will learn:

  1. How to do an explicit post-back using JavaScript.
  2. Handle those events at the server side.
  3. Pass data to the server.
  4. Convert a JSON-formatted string to an object of the specified type.

To fulfill the requirements a "_doPostBack ()" function is used to make the server-side event call. For example, if you want to raise the button (server-side control) click event from the JavaScript then the _doPostBack () function can be used.

Let's go through with one simple and short example to see how this happens.

Default.aspx

<%@ Page Language="C#" AutoEventWireup="false" CodeFile="Default.aspx.cs" Inherits="_Default" EnableEventValidation ="false" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="jquery-1.3.2.min.js" type="text/javascript"></script>
    <script src="MyJsFile.js" type="text/javascript"></script
>

    <style type ="text/css">
        .ButtonStyle
        {
       width:15em;
       height:2em;
        }
    </style
>
</head>
<
body>

    <form id="form1" runat="server">
   <asp:ScriptManager ID ="ScriptManager1" runat ="server"></asp:ScriptManager>
    <div
>

<button type ="button" id ="BtnClientSideButton"  class ="ButtonStyle" onclick ="funCallServerControl()">Call Server Control</button>

<asp:Button ID ="BtnServerControl" runat ="server" style ="display:none;" />
   <asp:Label runat ="server" ID ="Lable1" Text ="" ForeColor="Green"        Visible="false"></asp:Label>
    </div>
    </form
>
</body>
</
html>

Default.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Script.Serialization;

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

    }
    protected void BtnServerControl_Click(object sender, EventArgs e)
    {
        JavaScriptSerializer ObjLocSerializer = new JavaScriptSerializer();
       
        List<ClsStorageBO> ObjLocDataStorageBO =    ObjLocSerializer.Deserialize<List<ClsStorageBO>>(Request.Form["__EVENTARGUMENT"]);
        Lable1.Visible = true;
        Lable1.Text = ObjLocDataStorageBO[0].ProPubMessage;
 
    }
}


In the above given example I have used two buttons and one label out of which one is the client-side button and another is the server control. On the click of the client-side button I have called the JavaScript function in which I'm calling the doPostBack function explicitly to make the server-side control called and also am passing the data in the JSON format. At server-side I have used the JavaScriptSerializer to convert a JSON-formatted string to an object of the specified type and have assigned it to Lable1 and displayed it.

Up Next
    Ebook Download
    View all
    Learn
    View all