Important Note
Starting from version 2.0, Ajaxium automatically forces all ASP.NET controls to use an ASP.NET postback mechanism. A relevant information section has been provided for those of users who do not use Ajaxium Easy Mode and are in need of manual elimination of form postbacks.
How to eliminate form postbacks if Easy Mode is disabled
In order to make a web page AJAX-enabled the Ajaxium client-side code catches all the postbacks initiated by ASP.NET controls. But there are a few controls which rely on the browser's form submit functionality. Submit and Image Buttons are a good example of this kind of controls. Now let's put them on the Ajaxium Page and see what happens.
Below is the code-behind C# source of the page. As you can see all buttons and the CheckBox just update the text of a label.
using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class
_Default : Ajaxium.Page
{
protected void
Page_Load(object
sender, EventArgs
e)
{
}
protected void
Button1_Click(object
sender, EventArgs
e)
{
Label1.Text
= "Button1 clicked.";
}
protected void
Button2_Click(object
sender, EventArgs
e)
{
Label1.Text
= "Button2 clicked.";
}
protected void
ImageButton1_Click(object
sender, ImageClickEventArgs
e)
{
Label1.Text
= "Image Button clicked.";
}
protected void
CheckBox1_CheckedChanged(object
sender, EventArgs
e)
{
if(CheckBox1.Checked)
Label1.Text = "CheckBox1 checked.";
else
Label1.Text = "CheckBox1 cleared.";
}
}
CheckBox with AutoPostBack property set to "True" has been placed to make sure that Ajaxium works and the AJAX hidden postback is generated if you click it. But if you try to click the buttons and the image, you will notice that nothing has changed in comparison with standard ASP.NET. Form submittal and full round-trip are performed as if Ajaxium were not used. This is due to the fact that the controls that we have used avoid ASP.NET postback mechanics and all client-side Ajaxium JavaScript code. So form submits are not handled and we see the page in a classic ASP.NET mode. Put otherwise, what we see is just a graceful fallback to ASP.NET in action :)
Since we want our page to be a real Web 2.0 page, we need to do something to help Ajaxium to handle such controls.
The easiest way to do it is to implement a function which will register postbacks for all the submit and image buttons and call it from the Page.Render method as follows:
protected override
void Render(HtmlTextWriter writer)
{
RegisterPostbackForControls(this);
base.Render(writer);
}
private static
string EnsureEndsWithSemicolon(string attribute)
{
if(string.IsNullOrEmpty(attribute))
return
"";
return
attribute + ';';
}
private void RegisterPostbackForControls(Control
control)
{
foreach(Control
child in control.Controls)
{
Button
button = child
as Button;
if(button != null)
{
string onclick =
EnsureEndsWithSemicolon(button.Attributes["onclick"]);
button.Attributes["onclick"]
= onclick + Page.ClientScript.GetPostBackClientHyperlink(button, button.CommandArgument, true)
+ ";return false;";
} else
{
ImageButton imageButton =
child as ImageButton;
if(imageButton !=
null)
{
string onclick
= EnsureEndsWithSemicolon(imageButton.Attributes["onclick"]);
imageButton.Attributes["onclick"] = onclick
+ Page.ClientScript.GetPostBackClientHyperlink(imageButton,
imageButton.CommandArgument,
true) + ";return false;";
}
}
if(child.HasControls())
RegisterPostbackForControls(child);
}
}
Now if you click the buttons, you will see that Ajaxium handles all the clicks and performs page updates as required. So we are done with it.
Live demo
See this project in action
