I have two ASP.NET AJAX UpdatePanels .
there are two timers with diffrent intervals.
is it possible to update two updatepanels simultaneously together ?
like multi thread application .
each should be UpdatePanel Update in separate thread in one time.
i wrote this code but second timer does not work :
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<h2>
Welcome to ASP.NET!
</h2>
<p>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</p>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<asp:Timer ID="Timer1" runat="server" Interval="2000">
</asp:Timer>
<asp:Timer ID="Timer2" runat="server" Interval="2000">
</asp:Timer>
</asp:Content>
Behind Code :
Protected Sub Timer1_Tick(sender As Object, e As System.EventArgs) Handles Timer1.Tick
Label1.Text = Date.Now
End Sub
Protected Sub Timer2_Tick(sender As Object, e As System.EventArgs) Handles Timer2.Tick
Label2.Text = Date.Now
End Sub
Actually, your UpdatePanels are useless in this example, because your Timers are outside of them. As a result, every time your event gets triggered, it does a full page refresh. (This is in part why you never see the second Timer get hit -- by the time the first timer gets hit, the entire page gets refreshed, so the counter resets on the first timer)
So, you need to accomplish two things to fix your page:
Get the UpdatePanels to work properly with the Timers so that only asynchronous postbacks are occurring.
Make sure that each Timer only causes one UpdatePanel to refresh.
The first can be taken care of by either moving the Timer into the UpdatePanel, as a child, or by using the <asp:Triggers> element to basically say "The only thing that will update my UpdatePanel is this timer."
The second can be taken care of by setting the UpdateMode=Conditional attribute on each UpdatePanel.
Try this:
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<h2>
Welcome to ASP.NET!
</h2>
<p>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</p>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer2" />
</Triggers>
</asp:UpdatePanel>
<asp:Timer ID="Timer1" runat="server" Interval="2000" ontick="Timer1_Tick">
</asp:Timer>
<asp:Timer ID="Timer2" runat="server" Interval="2000" ontick="Timer2_Tick">
</asp:Timer>
</asp:Content>
I have to run to work now, so bear with me if you have any questions ;-)
Related
I am working on a web application (IIS) targeting .NET 4.0 using Visual Studio 2015.
I have an .aspx that contains 4 usercontrols (.ascx). When one of the usercontrols posts back the main .aspx AND the other three usercontrols also do a postback.
I'm looking for a way to prevent the other usercontrols from doing a postback when one of them does.
I've tried putting each of the usercontrols within an updatepanel (code below). I've tried putting an updatepanel within each usercontrol. I've tried changing the ChildrenAsTriggers and UpdateMode properties. I've tried creating a Click event in each usercontrol that's raised when the items within the usercontrol post back (example on just one of the usercontrols below).
No matter what, the page and all four usercontrols all do a postback every time one of them does.
Main .ASPX:
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<%# Register TagPrefix="uc1" TagName="Components" Src="Components.ascx" %>
<%# Register TagPrefix="uc2" TagName="Options" Src="Options.ascx" %>
<%# Register TagPrefix="uc3" TagName="Settings" Src="Settings.ascx" %>
<%# Register TagPrefix="uc4" TagName="Menu" Src="Menu.ascx" %>
<form id="form1" runat="server">
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnablePartialRendering="true"></cc1:ToolkitScriptManager>
<asp:Panel ID="pnlComponents" runat="server">
<asp:UpdatePanel ID="updpnlComponents" runat="server">
<ContentTemplate>
<uc1:Components id="Components" runat="server"></uc1:Components>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<asp:Panel ID="pnlOptions" runat="server">
<asp:UpdatePanel ID="updpnlOptions" runat="server">
<ContentTemplate>
<uc2:Options id="Options" runat="server" CssClass="jQTrackChanges"></uc2:Options>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<asp:Panel ID="pnlSettings" runat="server">
<asp:UpdatePanel ID="updpnlSettings" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Settings" EventName="Click" />
</Triggers>
<ContentTemplate>
<uc3:Settings id="Settings" runat="server" CssClass="jQTrackChanges"></uc3:Settings>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<asp:Panel ID="pnlMenu" runat="server">
<asp:UpdatePanel ID="updpnlMenu" runat="server">
<ContentTemplate>
<uc4:Menu id="Menu" runat="server" CssClass="jQTrackChanges"></uc4:Menu>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
</form>
Settings.ascx.vb:
Private Sub chkIn_CheckedChanged(sender As Object, e As EventArgs) Handles chkIn.CheckedChanged
RaiseEvent Click(Me, e)
End Sub
Private Sub chkOut_CheckedChanged(sender As Object, e As EventArgs) Handles chkOut.CheckedChanged
RaiseEvent Click(Me, e)
End Sub
Public Event Click As EventHandler
Edit - adding AutoPostBack=false and UpdateMode=Conditional has no effect. All four usercontrols still post back when one does.
Updated main .ASPX:
<asp:Panel ID="pnlOptions" runat="server" AutoPostBack="false">
<asp:UpdatePanel ID="updpnlOptions" runat="server" UpdateMode="Conditional" AutoPostBack="false">
<ContentTemplate>
<uc2:Options id="Options" runat="server" AutoPostBack="false" CssClass="jQTrackChanges"></uc2:Options>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<asp:Panel ID="pnlSettings" runat="server" AutoPostBack="false">
<asp:UpdatePanel ID="updpnlSettings" runat="server" UpdateMode="Conditional" AutoPostBack="false">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Settings" EventName="Click" />
</Triggers>
<ContentTemplate>
<uc3:Settings id="Settings" runat="server" AutoPostBack="false" CssClass="jQTrackChanges"></uc3:Settings>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<asp:Panel ID="pnlMenu" runat="server" AutoPostBack="false">
<asp:UpdatePanel ID="updpnlMenu" runat="server" UpdateMode="Conditional" AutoPostBack="false">
<ContentTemplate>
<uc4:Menu id="Menu" runat="server" AutoPostBack="false" CssClass="jQTrackChanges"></uc4:Menu>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
Please use autopostback property from properties window.change it's default behavior true or false and try again.
We eventually gave up and used Javascript to replace as much of the postback activity as possible to minimize the number of postbacks that happen.
I am using updatepanel and timer to display an alert every 15 seconds. It is working fine when I am not clicking anything in the page. It displays alert every 15 seconds. I have a button outside of this updatepanel. Whenever I click this button, the timer resets and it doesn't display alert every 15 seconds. If I stops clicking the button, it starts to display the alert after 15 seconds. BAsically, timer resets the interval when ever I click teh button. I want to display the alert regardless clicking a button or not. Please help me.
in ASPX page
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"
ViewStateMode="Enabled">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
</asp:UpdatePanel>
<asp:Timer ID="Timer1" runat="server" Interval="15000" OnTick="Timer1_Tick">
</asp:Timer>
In .CS page
public void Timer1_Tick(object sender, EventArgs e)
{
ScriptManager.RegisterClientScriptBlock(UpdatePanel1, typeof(Page), "ToggleScript", "
alert('Hello')", true);
}
Reason looks lik your button do a post back and your timer in out side the update panel so it will reset.
if you can place your button in to another update panel this will work.
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ViewStateMode="Enabled">
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" Interval="10000" OnTick="Timer1_Tick">
</asp:Timer>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
I am quite new to learning asp.net, so the question that I am asking may sound quite basic but I still need an answer as I am doing r&d with some of the toipcs.
I have 2 update panels in my page. Each contains a label. There are two buttons on my page, on the click event of the first button the label in the first update panel should get updated. On the click of the second button the label in the second update panel should get updated.
However when I click any of the two buttons both the labels get updated.
In the load event of the page the foll code is written
Label2.Text = DateTime.Now.ToString();
Label3.Text = DateTime.Now.ToString();
The code for both the update panel is as follows:
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID= "Button1" EventName="click" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button2" EventName="click" />
</Triggers>
</asp:UpdatePanel>
Remove the code from the page_load method and place it in the event of each of the buttons. So for button1 you put the code that updates label1 and for button2 you put the code that updates the label2.
You don't even need the triggers unless you're doing cross panel events. However, you do need to properly set up your script manager and update panels:
<asp:ScriptManager ID="ScriptManager1" runat="server"
EnablePartialRendering="true"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server"
UpdateMode="Conditional" OnLoad="Panel1_Load">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Button1"/>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server"
UpdateMode="Conditional" OnLoad="Panel2_Load">
<ContentTemplate>
<asp:Button ID="Button2" runat="server" Text="Button2"/>
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
Here you'd put your code in Panel1_Load(){} and Panel2_Load(){}.
Notice the settings: EnablePartialRendering="true"
and: UpdateMode="Conditional"
If you don't want the asp:Button controls on your panels, you'd have to put them somewhere that would block their normal full post-back behavior.
I have a listbox that is being updated via a timer and working as expected inside an UpdatePanel.
However I cannot get the selectedindexchanged event to fire. I presume this is something to do with the partial postback. Does anybody know what I can do to make this work?
When I move it out of the UpdatePanel it works fine. However obviously I cannot do partial postbacks.
<asp:UpdatePanel ID="UpdatePanel" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="500"></asp:Timer>
<asp:ListBox ID="ListBox_JobPositions" OnSelectedIndexChanged="ListBox_JobPositions_SelectedIndexChanged" runat="server" Height="750px" Width="300px" DataSourceID="sqlDataSource" DataTextField="Company" DataValueField="Pid"></asp:ListBox>
</ContentTemplate>
</asp:UpdatePanel>
UPDATE:
Have now tried the below change, the timer event is still working but the selectedindexchanged event is not. I am getting lost with this.
<asp:UpdatePanel ID="UpdatePanel" runat="server" ChildrenAsTriggers="False" UpdateMode="Conditional">
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="500"></asp:Timer>
<asp:ListBox ID="ListBox_JobPositions" runat="server" Height="750px" Width="300px" DataSourceID="sqlDataSource" DataTextField="Company" DataValueField="Pid" OnSelectedIndexChanged="ListBox_JobPositions_SelectedIndexChanged" AutoPostBack="True"></asp:ListBox>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" />
</Triggers>
Here is the event that does not fire when the listbox is inside the UpdatePanel but does work when it is not.
protected void ListBox_JobPositions_SelectedIndexChanged(object sender, EventArgs e)
{
Response.Write("test");
}
The reason you are not getting the event is that, your change event is not causing the PostBack. Your postback is caused by the timer.
The event asp.net receives is the timer event and not the ListBox event.
To resolve the issue, you should set AutoPostBack to true. This will cause the ListBox to do a PostBack as soon as the data changes and your event should fire.
<asp:ListBox ID="ListBox_JobPositions" AutoPostBack="True"
OnSelectedIndexChanged="ListBox_JobPositions_SelectedIndexChanged"
runat="server" Height="750px" Width="300px"
DataSourceID="sqlDataSource"
DataTextField="Company"
DataValueField="Pid">
</asp:ListBox>
Since you have set the UpdateMode to Conditional, you should also set the ChildrenAsTriggers to true. This way way the List causes a PostBack, that too will be a partial update.
<asp:UpdatePanel ID="UpdatePanel" runat="server"
UpdateMode="Conditional"
ChildrenAsTriggers="True">
Works now, had to manually specify Async and Full Postback triggers. Thanks for your help.
<asp:UpdatePanel ID="UpdatePanel" runat="server" ChildrenAsTriggers="False" UpdateMode="Conditional">
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="500"></asp:Timer>
<asp:ListBox ID="ListBox_JobPositions" runat="server" Height="750px" Width="300px" DataSourceID="sqlDataSource" DataTextField="Company" DataValueField="Pid" OnSelectedIndexChanged="ListBox_JobPositions_SelectedIndexChanged" AutoPostBack="True"></asp:ListBox>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" />
<asp:PostBackTrigger ControlID="ListBox_JobPositions" />
</Triggers>
</asp:UpdatePanel>
I'm trying to use some AJAX and ASP.Net together to enable me to run functions without having to refresh the whole page but i've stumbled across a problem in doing this
Here's my code
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DropDownList ID="ddl1" runat="server" OnSelectedIndexChanged="update1" />
<asp:TextBox runat="server" ID="txt1" />
</ContentTemplate>
</asp:UpdatePanel>
And here's my code behind
Sub update1(ByVal sender As Object, ByVal e As EventArgs)
txt1.Text = Now.ToString
End Sub
The event doesn't fire because I don't have AutoPostBack="True" on my ddl but adding that to the ddl will postback the whole page.
Is there a way to avoid using AutoPostBack="True" so that it only updates the panel?
I know I can use an asp:Button to get around this but i'd really like to be able to use a ddl with OnSelectedIndexChanged
Thanks
If you want to avoid to send the whole viewstate to the server, you should look at callbacks.
Instead, if you want to avoid a refresh of the entire page, but with postback, this should work:
<asp:DropDownList ID="ddl1" runat="server" OnSelectedIndexChanged="update1" AutoPostBack="True" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostbackTrigger ControlID="ddl1" EventName="SelectedIndexChanged" />
</Triggers>
<ContentTemplate>
<asp:TextBox runat="server" ID="txt1" />
</ContentTemplate>
</asp:UpdatePanel>
Try creating a new page with same codes and different page name. Worked for me