Variety ways to do asp.net ajax
There are variety of ways doing ajax implementation. In this section I am going to talk about how to implement different ways of ajax using asp.net and jquery.
- Update panel
In the page view you need to use “ScriptManager” and “UpdatePanel” server controls.
Code in page view:
<form id=”form1″ runat=”server”>
<asp:ScriptManager ID=”ScriptManager1″ runat=”server”>
</asp:ScriptManager>
<asp:UpdatePanel ID=”UpdatePanel1″ runat=”server” UpdateMode=”Conditional” RenderMode=”Block”>
<ContentTemplate>
<asp:Label ID=”lbDateTime” runat=”server” ></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID=”btShow” EventName=”Click” />
</Triggers>
</asp:UpdatePanel>
<asp:Button ID=”btShow” runat=”server” Text=”DateTime” onclick=”bt_click” />
</form>
Code behind page:
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void bt_click(object sender, EventArgs e)
{
lbDateTime.Text = DateTime.Now.ToShortDateString();
}
}
- Client callback method
Code in page view:
<head runat=”server”>
<title>Client Callbacks</title>
<script type=”text/javascript”>
function ReceiveServerData(arg, context) {
Message.innerText = “Date from server: ” + arg;
}
</script>
</head>
<body>
<h2>
Client Callbacks Without Postbacks</h2>
<form id=”form1″ runat=”server”>
<input type=”button” value=”Callback” onclick=”CallServer(‘1′, alert(‘Callback sent to Server’))” />
<br />
<span id=”Message”></span>
</form>
</body>
Code behind page:
protected void Page_Load(object sender, EventArgs e)
{
ClientScriptManager cm = Page.ClientScript;
String cbReference = cm.GetCallbackEventReference(this, “arg”,
“ReceiveServerData”, “”);
String callbackScript = “function CallServer(arg, context) {” +
cbReference + “; }”;
cm.RegisterClientScriptBlock(this.GetType(),
“CallServer”, callbackScript, true);
}
public string GetCallbackResult()
{
// Returns the results of a callback event to the client.
string dateString = DateTime.Now.ToLongDateString();
return dateString;
}
public void RaiseCallbackEvent(String eventArgument)
{
// Processes a callback event on the server using the event
// argument from the client.
string a = “”;
}
- Calling web method from javascript
- Calling web method from javascript using Jquery