Develop Reference

ASP Multiple UpdatePanels with gridviews but only one updating

I wish to have 3 gridviews on a single aspx page fed by individual DB queries (displaying static data, no manipulation) and based on a 10 second timer, refresh the tables. I have the code to return the datatables sorted. I can make it update one gridview which is in one of my update panels, but the other two dont render.
Code is:
<%# Page Title="Index" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Admin.aspx.cs" Inherits="Test.Admin" %>
<script runat="server" type="text/c#">
protected void Page_PreRender(object sender, EventArgs e)
{
Label1.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();
FullAccessSession.DataSource=GetStatus("FullAccess");
FullAccessSession.DataBind();
Label2.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();
LimitedAccessSession.DataSource=GetStatus("LimitedStatus");
LimitedAccessSession.DataBind();
Label3.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();
LogData.DataSource = GetLog() ;
LogData.DataBind();
}
protected void Timer1_Tick(object sender, EventArgs e)
{
Label1.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();
FullAccessSession.DataSource=GetStatus("FullAccess");
FullAccessSession.DataBind();
}
protected void Timer2_Tick(object sender, EventArgs e)
{
Label3.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();
LogData.DataSource = GetLog() ;
LogData.DataBind();
}
protected void Timer3_Tick(object sender, EventArgs e)
{
Label2.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();
LimitedAccessSession.DataSource=GetStatus("LimitedStatus");
LimitedAccessSession.DataBind();
}
</script>
<div class="row">
<div class="col-md-7">
<asp:UpdatePanel ID="UpdateFullAccessStatus" runat="server" UpdateMode="Always">
<ContentTemplate>
<!--<asp:Timer ID="Timer1" runat="server" Interval="10000" OnTick="Timer1_Tick">
</asp:Timer>-->
<asp:Label ID="Label7" runat="server" Font-Bold="True" Text="Full Access Logged In Users"></asp:Label>
<br />
<asp:Label ID="Label1" runat="server" Text="Panel not refreshed yet."></asp:Label>
<br />
<asp:GridView ID="FullAccessSession" runat="server">
</asp:GridView>
<br />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdateLimitedAccessStatus" runat="server" UpdateMode="Always">
<ContentTemplate>
<!--<asp:Timer ID="Timer3" runat="server" Interval="10000" OnTick="Timer2_Tick">
</asp:Timer>-->
<asp:Label ID="Label4" runat="server" Font-Bold="True" Text="Limited Access Logged In Users"></asp:Label>
<br />
<asp:Label ID="Label2" runat="server" Text="Panel not refreshed yet."></asp:Label>
<br />
<asp:GridView ID="LimitedAccessSession" runat="server">
</asp:GridView>
<br />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdateLog" runat="server" UpdateMode="Always">
<ContentTemplate>
<!--<asp:Timer ID="Timer2" runat="server" Interval="10000" OnTick="Timer2_Tick">
</asp:Timer>-->
<asp:Label ID="Label5" runat="server" Font-Bold="True" Text="General Log"></asp:Label>
<br />
<asp:Label ID="Label3" runat="server" Text="Panel not refreshed yet."></asp:Label>
<asp:GridView ID="LogData" runat="server">
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
I cant work out why one of my update panels are working. As you can see i've tried using the PreRender function as well as (currently commented out) timers. The labels are updating with the current time but only one gridview displays.
Any help would be appreciated
Thanks

The issue here is that the script of timer is lost after the post back inside the UpdatePanel - the solution is to take it out of the update panel and use Triggers
Here is an example that I test it and works.
<asp:Timer ID="Timer1" runat="server" ontick="Timer1_Tick" Interval="2800"></asp:Timer>
<asp:Timer ID="Timer2" runat="server" ontick="Timer2_Tick" Interval="2500"></asp:Timer>
<div>
<div>
<asp:UpdatePanel runat="server" ID="UpdatePanel1" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" />
</Triggers>
<ContentTemplate>
<asp:Literal runat="server" ID="txtTest1"></asp:Literal>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div>
<asp:UpdatePanel runat="server" ID="UpdatePanel2" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer2" />
</Triggers>
<ContentTemplate>
<asp:Literal runat="server" ID="txtTest2"></asp:Literal>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
and on code behind the ontick is the trigger, eg:
protected void Timer1_Tick(object sender, EventArgs e)
{
txtTest1.Text += "1.";
}

Page Flickering on Dropdown change

I'm using a drop down list to select the customer. The page flicker twice on selecting the customer and I don't know how to rectify it. Can someone please help me solve the problem?
My Drop Down SelectedIndexChange Code
protected void ReceiverDropDown_SelectedIndexChanged(object sender, EventArgs e)
{
if (ReceiverDropDown.SelectedValue != null && ReceiverDropDown.SelectedValue != "0")
{
string benId = ReceiverDropDown.SelectedValue;
Page.ClientScript.RegisterStartupScript(this.GetType(), "alert", "AddDetails('" + benId + "');", true);
}
}
Code using Update Panel
<td>
<asp:UpdatePanel runat="server" ID="updTerms" UpdateMode="Conditional">
<ContentTemplate>
<asp:DropDownList Width="180px" CssClass="select_quo_one" ID="ReceiverDropDown"
runat="server" AutoPostBack="true"
OnSelectedIndexChanged="ReceiverDropDown_SelectedIndexChanged">
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ReceiverDropDown" />
</Triggers>
</td>

To avoid page flickering you can make use of update panel. Bind the DropDownList inside update panel.
Markup:
<asp:UpdatePanel runat="server" ID="updTerms">
<ContentTemplate>
<asp:DropDownList ID="ReceiverDropDown" runat="server">
</asp:DropDownList>
</ContentTemplate>
<Trigger>
<asp:AsyncPostBackTrigger ControlID="ReceiverDropDown" />
</Trigger>
</asp:UpdatePanel>

Use update field like:
<asp:UpdatePanel ID="updpnlRefresh" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:TextBox ID="txtQuantity" runat="server" Width="50px"
onkeydown="ClearErrorMessages()" onkeypress="return allowNumeric(event)"
ontextchanged="txtQuantity_TextChanged" Text='<%#Eval("Quantity") %>'
AutoPostBack = "true" ondragstart="return false;"
ondrop="return false;" />
</ContentTemplate>
</asp:UpdatePanel>

Div show hide not working when using UpdatePanel inside dev

<div id="test1" runat="server">
<asp:UpdatePanel runat="server" ID="updTerms">
<ContentTemplate>
<asp:Button ID="btnSubmit" Enabled="false" CssClass="asgButton" runat="server" Text="Submit" onclick="btnSubmit_Click"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div id="test2" visible="false" runat="server">
<p>this is sample text.... bla bla bla</p>
</div>
C# Code:
protected void btnSubmit_Click(object sender, EventArgs e)
{
if (Page.IsValid) {
// ...
test1.Visible = false;
test2.Visible = true;
} else {
// do some thing...
}
}

Only elements inside of the update panel will be updated when an update panel is triggered.
Since you only have the button in the update panel, the button is the only thing that will get updated, even though you set it in the code behind. You just have to wrap all the elements you want updated in the panel like so.
<asp:UpdatePanel runat="server" ID="updTerms">
<ContentTemplate>
<div id="test1" runat="server">
<asp:Button ID="btnSubmit" Enabled="false" CssClass="asgButton" runat="server" Text="Submit" onclick="btnSubmit_Click" />
</div>
<div id="test2" visible="false" runat="server">
<p>this is sample text.... bla bla bla</p>
</div>
</ContentTemplate>
</asp:UpdatePanel>

Try following Code:
<asp:UpdatePanel runat="server" ID="updTerms">
<ContentTemplate>
<div id="test1" runat="server">
<asp:Button ID="btnSubmit" Enabled="True" CssClass="asgButton" runat="server" Text="Submit" OnClick="btnSubmit_OnClick"/>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel runat="server" ID="updDiv2" UpdateMode="Conditional">
<ContentTemplate>
<div id="test2" visible="false" runat="server">
<p>this is sample text.... bla bla bla</p>
</div>
</ContentTemplate>
</asp:UpdatePanel>
And in code-behind:
protected void btnSubmit_OnClick(object sender, EventArgs e)
{
if (Page.IsValid)
{
test1.Visible = false;
test2.Visible = true;
updDiv2.Update();
}
}
If you update controls from an UpdatePanel they have to be either in the same UpdatePanel or in another one.
If the controls are in another one make sure to call Update of the UpdatePanel containing the controls after editing them.
Make sure as well to set UpdateMode="Conditional" on the UpdatePanel otherwise Update would throw an exception.

Cover your complete div inside update panel..You should place the controls which have to be updated inside update panel..
<asp:UpdatePanel runat="server" ID="updTerms">
<ContentTemplate>
<div id="test1" runat="server">
<asp:Button ID="btnSubmit" Enabled="false" CssClass="asgButton" runat="server" Text="Submit" onclick="btnSubmit_Click" />
</div>
<div id="test2" visible="false" runat="server">
<p>this is sample text.... bla bla bla</p>
</div>
</ContentTemplate>
</asp:UpdatePanel>

My suggestion is do not use Visible property.Instead do the following things
1)Remove Visibile="False" .Use Style="display:none"
<div id="test2" style="display:none" runat="server">
2)Add the following javascript in the design page.
function divviZ()
{
var test1=document.getElementById("<%=test1.ClientId%>");
var test2=document.getElementById("<%=test2.ClientId%>");
if(test2.style.display=="none")
{test1.style.display="block";}
else
{test1.style.display="none";}
}
3)Change the vb code as follows
protected void btnSubmit_Click(object sender, EventArgs e)
{
if (Page.IsValid) {
// ...
test2.style("display")="block"
ScriptManager.RegisterClientScriptBlock(this, this.GetType, "divviz", "javascript:divviZ()", True)
} else {
// do some thing...
}
}

AsyncPostBackTimeout not updating data in updatepanel

I wanted to update data inside update panel without postback.
I made following code on aspx:
<asp:ScriptManager ID="ScriptManager1" runat="server" AsyncPostBackTimeout="30">
</asp:ScriptManager>
<asp:UpdatePanel ID="upPanel" runat="server">
<ContentTemplate>
<asp:Label ID="lblCount" runat="server"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
for updating the label on every half a minute, i written following code on pageload:
protected void Page_Load(object sender, EventArgs e)
{
lblCount.Text = DateTime.Now.ToShortTimeString();
}
But its not updating the label even though i given
AsyncPostBackTimeout="30"
in script manager.
Is anything i am mistaking??
I want to update label inside the updatepanel without postback on certain time interval.
Edit:
<asp:UpdatePanel ID="upPanel" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
<ContentTemplate>
<asp:Label ID="lblCount" runat="server"></asp:Label>
</ContentTemplate>.
</asp:UpdatePanel>

To update your your page every 30 seconds you can use a timer:
<head runat="server">
<title></title>
<script runat="server" type="text/c#">
protected void Timer1_Tick(object sender, EventArgs e)
{
lblCount.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();
}
</script>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" AsyncPostBackTimeout="30">
</asp:ScriptManager>
<asp:Timer runat="server" id="Timer1" Interval="30000" OnTick="Timer1_Tick"></asp:Timer>
<asp:UpdatePanel ID="upPanel" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
<ContentTemplate>
<asp:Label ID="lblCount" runat="server" Text="Page not refreshed yet."></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</form>
As #Nipun Ambastha suggested add the AsyncPostBackTrigger trigger.
Without AsyncPostBackTrigger, the timer has to be placed inside the UpdatePanel:
protected void Timer1_Tick(object sender, EventArgs e)
{
Label1.Text = "Panel refreshed at: " +
DateTime.Now.ToLongTimeString();
}
<form id="form2" runat="server">
<asp:ScriptManager runat="server" ID="ScriptManager2">
</asp:ScriptManager>
<asp:UpdatePanel runat="server" ID="UpdatePanel1">
<ContentTemplate>
<asp:Timer runat="server" ID="Timer2" Interval="30000" OnTick="Timer1_Tick"></asp:Timer>
<asp:Label runat="server" Text="Page not refreshed yet." ID="Label1">
</asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<asp:Label runat="server" Text="Label" ID="Label3"></asp:Label>
</form>

You are actually not using Async Trigger, for updating a panel you will need to declare Async Trigger.
Please check this url
http://msdn.microsoft.com/en-us/library/system.web.ui.asyncpostbacktrigger(v=vs.110).aspx
More Detailed
http://www.asp.net/ajax/documentation/live/overview/UpdatePanelOverview.aspx

Trigger UpdatePanel from Dropdownlist in ChildControl

This is my situation:
Page:
<asp:UpdatePanel ID="updatePanel1" runat="server" ChildrenAsTriggers="true">
<ContentTemplate>
...
<uc:ChildControl ID="ucChild" runat="server" />
...
</ContentTemplate>
</asp:UpdatePanel>
ChildControl:
...
<asp:DropDownList id="dropDown1" runat="server" />
...
I want to update the UpdatePanel (asynchronously) in the Page when the selection of the DropDownList in the ChildControl changes. I tried AutoPostBack="true", but this always leads to a full PostBack of the Page (see this question).
I tried to use
<Triggers>
<asp:AsyncPostBackTrigger ControlID="???" EventName="SelectedIndexChanged" />
</Triggers>
but neither "dropDown1" nor "ucChild.dropDown1" worked as values for ControlID.
I also tried to pass a reference of the UpdatePanel to the ChildControl and add a Trigger in the following way:
protected override void OnPreRender(EventArgs e)
{
if (ParentUpdatePanel != null)
{
AsyncPostBackTrigger trigger = new AsyncPostBackTrigger();
trigger.ControlID = dropDown1.ID;
trigger.EventName = "SelectedIndexChanged";
ParentUpdatePanel.Triggers.Add(trigger);
}
base.OnPreRender(e);
}
(also tried with dropDown1.ChildID)
But I am still unable to get the UpdatePanel to trigger when the value in the Dropdown changes. The problem seems to be that the UpdatePanel cannot see the Control in the ChildControl and therefore is unable to set the Trigger accordingly.
How can I do it?

Maybe with a trick putting this code on dropdown list.
dropDown1.Attributes["onchange"] =
Page.ClientScript.GetPostBackEventReference(ParentUpdatePanel, "") + "; return false;";
When you change the drop down list you send an update event to UpdatePanel using direct javascript call.

Setting AutoPostBack=True on the Drop Down List control should not refresh the entire page if it is in an update panel.
I created a simple example:
default.aspx:
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="up" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
<ContentTemplate>
<uc:UserControl ID="ucChild" runat="Server"></uc:UserControl>
<asp:Label ID="lbl" runat="server"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
default.aspx.cs (code behind):
public partial class _default : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) {
lbl.Text = ucChild.value;
}
}
UserControl.ascx:
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="UserControl.ascx.cs" Inherits="somenamespace.UserControl" %>
<asp:DropDownList runat="server" ID="ddl" AutoPostBack="true">
<asp:ListItem Text="1" Value="1"></asp:ListItem>
<asp:ListItem Text="2" Value="2"></asp:ListItem>
</asp:DropDownList>
UserControl.ascx.cs (code behind):
public partial class UserControl : System.Web.UI.UserControl {
public string value {
get { return ddl.SelectedValue.ToString(); }
}
}
When I change the dropdownlist, the label is updated without a full post back.