|
Interval
|
Gets or sets the time interval in
milliseconds after OnTick event of Timer control will fire.
|
|
OnTick
|
Used to specifiy the method name
that will after specified time interval.
|
|
DEMO
: Timer Control
|
|
|
1. Inside an UpdatePanel control
When the timer control is used inside an UpdatePanel control, the Timer control automatically works as a trigger for the UpdatePanel control, however we can override this behavior by setting the ChildrenAsTriggers property of UpdatePanel as false. In this case lets say server takes 7 seconds to process the request then following message will change after every 12 (5+7) seconds as I have specified Timer interval property as 5000 milliseconds (5 seconds). Following message will change after every 5 seconds
634804680362449375 - Timer control from inside UpdatePanel ticked
<asp:UpdatePanel runat="server"
ID="UpdatePanel1" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label runat="Server" ID="lblMessage1"
Text="Please wait ..." SkinID="FormValueMessage" />
// Timer
control inside UpdatePanel
<asp:Timer runat="Server" ID="Timer1"
OnTick="Timer1_Tick" Interval="5000" />
</ContentTemplate>
</asp:UpdatePanel>
|
|
|
2.
Timer Control Outside UpdatePanel
When the Timer control is outside
an UpdatePanel control, we must explicitely define the Timer control as
trigger for the UpdatePanel control to be updated.
In this case Timer, Timer OnTick event will fire after every 3 seconds irrespective of how many seconds server takes to process the request as I have specified Interval as 3000 Milliseconds. Following message will change after every 3 seconds
634804680373777500 - Timer control from outside UpdatePanel ticked
<asp:UpdatePanel runat="server"
ID="UpdatePanel2" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer2"
EventName="Tick" />
</Triggers>
<ContentTemplate>
<asp:Label runat="Server" ID="lblMessage2"
SkinID="FormValueMessage" />
</ContentTemplate>
</asp:UpdatePanel>
// Timer control outside UpdatePanel
<asp:Timer runat="Server"
ID="Timer2" OnTick="Timer2_Tick"
Interval="3000" />
|
|
AssociatedUpdatePanelID
|
Gets or sets the ID of the
UpdatePanel control from which it is associated with.
|
|
AssociatedUpdatePanelID
|
Gets or sets the ID of the
UpdatePanel control from which it is associated with.
|
|
ClientID
|
Gets the server control identifier
generated by ASP.NET
|
|
ClientID
|
Gets the server control identifier
generated by ASP.NET
|
|
DisplayAfter
|
Gets or sets a value in
milliseconds before the UpdateProgress control is displayed.
|
|
ClientID
|
Gets the server control identifier
generated by ASP.NET
|
|
ProgressTemplate
|
Gets or sets the template that
defines the content of the UpdateProgress control.
|
|
DEMO
: UpdateProgress
|
|||||||||||
|
|||||||||||
|
<asp:UpdatePanel ID="UpdatePanel1"
runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label
ID="lblMessage" runat="server"
EnableViewState="false" ForeColor="blue"> </asp:Label>
<table border="1">
<tr> <td>Name</td>
<td><asp:TextBox ID="TextBox1" runat="Server"></asp:TextBox>
<asp:RequiredFieldValidator ID="Req1"
runat="server" ControlToValidate="TextBox1" Text=" *
Required"></asp:RequiredFieldValidator> </td> </tr>
<tr> <td>Address</td>
<td><asp:TextBox ID="TextBox2"
runat="Server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1"
runat="server" ControlToValidate="TextBox2" Text=" *
Required"></asp:RequiredFieldValidator> </td>
</tr>
<tr> <td>Phone</td>
<td><asp:TextBox ID="TextBox3"
runat="Server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2"
runat="server" ControlToValidate= "TextBox3" Text="
* Required"></asp:RequiredFieldValidator> </td> </tr>
<tr> <td>City</td>
<td><asp:TextBox ID="TextBox4"
runat="Server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3"
runat="server" ControlToValidate= "TextBox4" Text="
* Required"></asp:RequiredFieldValidator> </td> </tr>
<tr> <td><b>Notice "Please
wait" message below after clicking button.</b></td>
<td><asp:Button
ID="btnSave" runat="Server"
OnClick="AddRecords" Text="Add Records" /></td>
</tr> </table>
</ContentTemplate>
</asp:UpdatePanel>
// UpdateProgress control
<asp:UpdateProgress ID="Up1"
runat="Server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<span
style="background-color:Yellow;"><img
src="/images/wait.gif" alt="Please wait" />
Please
wait ...</span>
</ProgressTemplate>
</asp:UpdateProgress>
|
|||||||||||
|
ChildControlsCreated
|
Gets or sets a value that
indicates whether the server control's child control have been created.
|
|
ChildrenAsTriggers
|
Gets or sets a value that
indicates whether postback from immediate child controls of an UpdatePanel
control updates the panel's content.
|
|
ClientID
|
Gets the server control identifier
generated by ASP.NET
|
|
ContentTemplate
|
This is the must use property of
the UpdatePanel control. Gets or sets the template that defines the content
of the UpdatePanel control. You need to place content of the page that you
want to be in the UpdatePanel inside this.
|
|
EnableTheming
|
Gets or sets a value that
indicates whether themes apply to this control.
|
|
EnableViewState
|
Gets or sets a value (true/false)
that indicates whether the server control persists its and its child control
view state.
|
|
IsInPartialRendering
|
Gets or sets a value (true/false)
that indicates whether UpdatePanel control is being updated as a result of an
asynchornous postbacks.
|
|
RenderMode
|
Gets or sets a value
(Block/Inline) that indicates whether content is enclosed with HTML div
(block) or span (inline).
|
|
Triggers
|
Gets an
UpdatePanelTriggerCollection object that contains AsyncPostBackTrigger and
PostBackTrigger objects that were registered for the UpdatePanel control.
|
|
UpdateMode
|
Gets or sets a value
(Always/Conditional) that indicates when an UpdatePanel controls content is
updated. Always: Update the content of the UpdatePanel irrespective
any postback. Conditional: Update the content of the UpdatePanel when
control triggers associated with this UpdatePanel.
|
|
DEMO
: UpdatePanel
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
// Update Panel
<asp:UpdatePanel runat="Server"
ID="UpdatePanel1" UpdateMode="Conditional">
// Content
Template, You can put whatever content you want,
// any event
fires inside this block will update this block content only
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server"
DataSourceID="SqlDataSource1" Caption="Try using Edit/Delete
and notice whole page is not refreshing"
AllowPaging="True" AllowSorting="True"
AutoGenerateEditButton="true" DataKeyNames="AutoID"
PageSize="5" CellPadding="2"
CellSpacing="1" EmptyDataText="<b>Sorry, There are no
records to show in GridView. </b>">
<Columns>
<asp:TemplateField HeaderText="Delete?">
<ItemTemplate>
<asp:LinkButton ID="lnk1" runat="server" Text="Delete"
OnClientClick="return confirm('Are you sure to Delete?')"
CommandName="Delete"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
// SqlDataSource, the datasource of the
GridView
<asp:SqlDataSource ID="SqlDataSource1"
runat="server" ConnectionString='<%$ ConnectionStrings:ConnStr
%>'
SelectCommand="Select * FROM SampleForTutorials ORDER BY
[Name]" DeleteCommand="Delete FROM SampleForTutorials WHERE AutoID
= @AutoID"
UpdateCommand="UPDATE SampleForTutorials SET Name = @Name,
Address = @Address, Phone = @Phone, City = @City WHERE AutoID =
@AutoID">
<DeleteParameters>
<asp:Parameter
Name="AutoID" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="AutoID" Type="Int32" />
<asp:Parameter Name="Name" Type="string"
Size="50" />
<asp:Parameter Name="Address" Type="string"
Size="200" />
<asp:Parameter Name="Phone" Type="string" />
<asp:Parameter Name="City" Type="string"
Size="20" />
</UpdateParameters>
</asp:SqlDataSource>
</ContentTemplate>
</asp:UpdatePanel>
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
