Page Flickering on Dropdown change - c#

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>

Related

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.";
}

Why my button code doesn't work after using AJAX in ASP.NET?

I have a button in asp.net to clear textboxes and I used ajax as below:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button2" runat="server" Font-Bold="False" Font-Names="Tahoma" Font-Size="16px" ForeColor="DarkRed" Height="40px" OnClick="Button2_Click" Text="Clear Form" Width="165px" />
</ContentTemplate>
</asp:UpdatePanel>
As well, this button has following C# code:
protected void Button2_Click(object sender, EventArgs e)
{
txtFirstName.Text = string.Empty;
txtLastName.Text = string.Empty;
txtEmail.Text = string.Empty;
txtSubject.Text = string.Empty;
txtMessage.Text = string.Empty;
}
However, foregoing C# code doesn't work when I execute this program!; In other words, textboxes don't clear after I click on button!
Please tell me why it happens?!
I have tried and the button code is working
.aspx code
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>
<asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<asp:TextBox ID="txtSubject" runat="server"></asp:TextBox>
<asp:TextBox ID="txtMessage" runat="server"></asp:TextBox>
<asp:Button ID="Button2" runat="server" Font-Bold="False" Font-Names="Tahoma" Font-Size="16px" ForeColor="DarkRed" Height="40px" OnClick="Button2_Click" Text="Clear Form" Width="165px" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
.aspx.cs page coding
protected void Button2_Click(object sender, EventArgs e)
{
txtFirstName.Text = string.Empty;
txtLastName.Text = string.Empty;
txtEmail.Text = string.Empty;
txtSubject.Text = string.Empty;
txtMessage.Text = string.Empty;
}
You need to modify your updatepanel.Kindly place all your Label and TextBox Control inside Update Panel and Button Events outside your UpdatePanel and add Trigger of your button ID.
AsyncPostBackTrigger or PostBackTrigger
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
// HERE YOUR TEXTBOX AND LABEL CONTROLS
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button2"
</Triggers>
</asp:UpdatePanel>
<asp:Button ID="Button2" runat="server" Font-Bold="False" Font-Names="Tahoma" Font-Size="16px" ForeColor="DarkRed" Height="40px" OnClick="Button2_Click" Text="Clear Form" Width="165px" />
You should place the Textboxes inside update panel as
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>
<asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<asp:TextBox ID="txtSubject" runat="server"></asp:TextBox>
<asp:TextBox ID="txtMessage" runat="server"></asp:TextBox>
<asp:Button ID="Button2" runat="server" Font-Bold="False" Font-Names="Tahoma" Font-Size="16px" ForeColor="DarkRed" Height="40px" OnClick="Button2_Click" Text="Clear Form" Width="165px" />
</ContentTemplate>
</asp:UpdatePanel>

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

Selecting an asp.net control which is in an UpdatePanel

I want to enable a DropDownList which is in a ListView (ID = "SehensList") and put in an UpdatePanel. My first bet was the following, but it didn't work;
DropDownList DropdownDistrict = (DropDownList)SehenList.InsertItem.FindControl("DistrictDropDownListInsert");
DropdownDistrict.Enabled = true;
Here is the aspx side;
<InsertItemTemplate>
<tr style="">
<td>
<asp:Button ID="InsertButton" runat="server" CommandName="Insert" Text="Insert" />
<asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Clear" />
</td>
<td>
<asp:TextBox ID="CityFKTextBox_Insert" runat="server" Visible="false" Text='<%# Bind("CityFK") %>' />
<asp:DropDownList ID="CityFKDropDownListInsert" runat="server" DataSourceID="CityFKEntityDataSource_Insert" AutoPostBack="true"
OnSelectedIndexChanged="CityFKDropDownListInsert_SelectedIndexChanged" DataTextField="CityName" DataValueField="CityID"
AppendDataBoundItems="true">
<asp:ListItem Text="-Stadt Wählen-" Value="0" ></asp:ListItem>
</asp:DropDownList>
<asp:EntityDataSource ID="CityFKEntityDataSource_Insert" runat="server"
ConnectionString="name=MedicalEntities" DefaultContainerName="MedicalEntities"
EntitySetName="Cities">
</asp:EntityDataSource>
<asp:ScriptManager ID="SMCityFKInsert" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UPCityFKInsert" runat="server">
<ContentTemplate>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="CityFKDropDownListInsert" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
</td>
<td>
<asp:TextBox ID="DistrictTextBox_Insert" runat="server" Visible="false" Text='<%# Bind("District") %>' />
<asp:DropDownList ID="DistrictDropDownListInsert" runat="server" Enabled="false" AutoPostBack="true"
OnSelectedIndexChanged="DistrictDropDownListInsert_SelectedIndexChanged" DataTextField="DistrictName" DataValueField="DistrictID"
AppendDataBoundItems="true">
<asp:ListItem Text="-Stadt Wählen-" Value="0" ></asp:ListItem>
</asp:DropDownList>
<asp:UpdatePanel ID="UPDistrictInsert" runat="server">
<ContentTemplate>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DistrictDropDownListInsert" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
</td>
</tr>
</InsertItemTemplate>
As you notice DropDownLists are outside of the UpdatePanel and are called through "Triggers". If I put the DropDownLists into the UpdatePanel ContentTemplate (I guess, this is a totally wrong approach), second DropDownList "DistrictDropDownListInsert" is enabled but at that case it is not updated more than once. I mean by "not updated more than once" if you change the first DropDownList "CityFKDropDownListInsert" it is set to its previous value (not the default value but the first selected value). I know it's a bit confusing. If you have any unclear part please let me know.
It should be like this:
protected void SehenList_ItemInserting(object sender, ListViewInsertEventArgs e)
{
var pnl = SehenList.InsertItem.FindControl("UPCityFKInsert") as UpdatePanel;
if (pnl != null)
{
var ddlDistrictInsert = pnl.FindControl("DistrictDropDownListInsert") as DropDownList;
if (ddlDistrictInsert != null) ddlDistrictInsert.Enabled = true;
}
}

UpdatePanel in ascx

Hei, I have an ajax UPdatepanel in master page who male reference to usercontrol, I make another updatepanel inside this usecontrol but i dont get the event.
I'm new in Ajax and i tried but i dont get it, can anybody help me.
Thanks
Master.cs
UpdatePanel - reference to search.ascx Parententer
UpdatePanel - reference to Form.ascx Child
Master.cs
protected void SokBtn_Click(object sender, EventArgs e)
{
Db.Freetext = txtBuscador.Text.Trim();
Db.itemId = 0;
MainContent.Controls.Clear();
if (!string.IsNullOrEmpty(txtBuscador.Text))
{
search Search = (search)LoadControl("~/search.ascx");
Search.FreeText = txtBuscador.Text;
Search.UserId = idUser;
MainContent.Controls.Clear();
MainContent.Controls.Add(Search);
}
}
<asp:ScriptManager ID="ScriptManager1" runat="server" >
</asp:ScriptManager>
<asp:UpdatePanel runat="server" id="UpdatePanel" updatemode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger controlid="btnSearch" eventname="Click" />
</Triggers>
<ContentTemplate>
<asp:ContentPlaceHolder ID="MainContent" runat="server"></asp:ContentPlaceHolder>
</ContentTemplate>
</asp:UpdatePanel>
Search.ascx
<div id="divContenidoGestion" style="width:1060px; top:250px; position:absolute;">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true" UpdateMode="always" >
<ContentTemplate>
<asp:PlaceHolder ID="Item" runat="server" EnableViewState="False"></asp:PlaceHolder>
</ContentTemplate>
</asp:UpdatePanel>
</div>

Categories

Resources