How to do a Postback with Client Side Object

Neil de Weerdt

2.44/5 (6 votes)

Jul 15, 2004

129462

How to do a Postback with Client Side Object

Introduction

This article shows how to do a Postback with Client Side Object

Using the code

Use of Input Button

Switch to View-HTML-Code and then inside the <form> tag add the following code :-

<input type=button value="Click Me" id="htmlClientButton" 
 onclick="javascript:doButtonPostBack();" 
 runat="server" NAME="htmlClientButton">

Add the onclick client event inside the <head> tag

<script language="javascript">
  function doButtonPostBack(){ 
    alert("Welcome to my input button PostBack");
  }
</script>

Now we can do the Server code. When we added the runat=server the designer created a server object for us to use. Now we just need to attach a method / event for it

this.htmlClientButton.ServerClick += 
  new EventHandler(htmlClientButton_ServerClick);

private void htmlClientButton_ServerClick(object sender, EventArgs e)
{
  /// do some Server Code
  this.Page.Controls.Add(new LiteralControl(''<HR>''));
}

Tablecell PostBack

Do the same as with the button, only difference is that you are going to set the style to hidden

<input type=button value="Click Me" id="htmlClientButton" 
 onclick="javascript:doButtonPostBack();" 
runat="server" NAME="htmlClientButton" style="VISIBILITY: hidden">

Attach a Client Side Method Call

<TD onclick="javascript:doTableCellPostBack();"></TD>

Now we need to add the onclick script inside the <head> tag. Add the following code

<script language="javascript">
function CellPostBack(){ 
    alert("Hello Cell PostBack "); 
    var theform; 
    if (window.navigator.appName.toLowerCase().indexOf("netscape") > -1) {
        theform = document.forms["Form1"]; 
    }
    else { 
        theform = document.Form1; 
    } 
     theform.__EVENTTARGET.value = "MyCellButton"; // Hiddin Button ID 

    theform.__EVENTARGUMENT.value = null; 
    theform.submit(); 
}    
</script>

That's all.

Conclusion

Feedback is expected and appreciated.