I need to have UpdatePanel with asyncpostback, but in my case it seems that no partial postback happens, but fullpostback. I am new to web forms, please, check the code:
<%# Register TagPrefix="Cust" TagName="CompanyInformationView" Src="~/CustomControls/CompanyInformationView.ascx" %>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">
<asp:UpdatePanel runat="server" ID="UpdatePanel1" ChildrenAsTriggers="true" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" OnClick= "Button1_Click" Text="test" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<Cust:CompanyInformationView ID="CompanyInformationView" runat="server" />
</asp:Content>
So I have Test Button. OnClick it should do "nothing" for test. Also there is custom control on web form. Here is server side code for this form:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
// fill in custom control
CompanyInfo c = GetInfo();
CompanyInformationView.Company = c;
}
}
protected void Button1_Click(object sender, EventArgs e)
{
var i = 1;
}
CompanyInformationView is custom control with property "Company". There is no ViewState added for this property (so it cannot be loaded properly if postback is done). When I click on Test Button, the page fails, because "CompanyInformationView.Company" is not set (it is not set, because it cannot be loaded from ViewState, I guess).
Instead, I think that it should not work like this. AsynPostback should deal only with UpdatePanel.
Why it wants to reload custom control? Doesn't it mean that Full postback happen or maybe I do not understand Asyncpostback?
PageLoad and all other events are raised on every get\postback, no matter if it's async or full,
In asyncpostback, the response which the server renders includes only the content inside the updatepanel.
Try to Put <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
Before
<asp:UpdatePanel runat="server" ID="UpdatePanel1" ChildrenAsTriggers="true" UpdateMode="Conditional">
Async post back in web forms still proceeds the whole page life cycle as if it's a traditional post. the difference is only the updated content inside target update panel that will be sent in response. so in this case, async post back will still give you exception unless you populate the custom control no matter get/post.
you need to also put the custom control inside another update panel or in the same update panel as the button in order see partial update to happen.
Related
What I'm trying to do: I'm trying to update an image (in a UpdatePanel control) every .5 seconds using a thread in the code behind the web page (I'm using a ASP.NET Web Forms Site Project)
What I have so far: I have mock images on the screen are the moment. I also have a thread written that gets called with a button click.
Here is that code:
protected void Button1_Click(object sender, EventArgs e)
{
DoThing();
}
public void DoThing()
{
Thread thread = new Thread(() => {
while (true)
{
UpdatePanel1.Update();
System.Threading.Thread.Sleep(500);
if (Image2.ImageUrl == "~/Images/Water3.png")
{
Image2.ImageUrl = "~/Images/Water1.png";
continue;
}
if (Image2.ImageUrl == "~/Images/Water1.png")
{
Image2.ImageUrl = "~/Images/Water2.png";
continue;
}
if (Image2.ImageUrl == "~/Images/Water2.png")
{
Image2.ImageUrl = "~/Images/Water3.png";
continue;
}
}
});
thread.Start();
thread.Join();
}
and here is my HTML:
<%# Page Title="Home Page" Language="C#" Async="true" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<asp:Content runat="server" ID="FeaturedContent" ContentPlaceHolderID="FeaturedContent">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Image ID="Image1" runat="server" Height="32px" Width="32px" ImageUrl="~/Images/Fauset.png"/><asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click"/><br />
<asp:Image ID="Image2" runat="server" Height="96px" Width="32px" ImageUrl="~/Images/Water1.png" OnLoad="Image2_Load"/><br />
<asp:Image ID="Image3" runat="server" Height="32px" Width="32px" ImageUrl="~/Images/Bucket.png"/>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
</asp:Content>
Problem: When i click the button the page is currently doing nothing. When i put a break point in the thread the thread is running. The page just isn't updating for some reason.
Notes: Im trying to stay away from JS, Jquery and JSON as much as possible because i barley know them but if i need to use them i need to use them
Once the page has rendered, you can't change it from code still running on the server without making use of some sort of client-side technology (Javascript/jQuery, etc).
In this case in particular, where you're trying to implement what effectively seems like an image slider, you can do it very easily using jQuery and one of the many slider plugins, which would also give you animated transitions.
You can't do the thing you want to do the way you want to do it. Server side code runs on the server, client side code runs on the client. Updating the content of a server control on the server will only reflect on the client if you can make the client reload the page or the control you've modified. There are many ways to reload pages/parts of the page, but in this case you're best off using some client side JavaScript.
It looks like the images are static, so you can probably get away with using a simple jquery image slider. There are many free ones available, find one that will change the image every 5 seconds and use that instead of trying to build a Goldberg machine just because you're more comfortable with doing it in one way.
This functionality is built in. All you have to do is add an Asynchronous Trigger and timer to your update panel.
<asp:UpdatePanel ID="UpdatePanel1" runat="server" OnLoad="upOnLoading" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<ControlToUpdate>
....
</ControlToUpdate
<asp:Timer ID="Timer1" runat="server" Interval="2000" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" />
</Triggers>
</asp:UpdatePanel>
and your method...
protected void upOnLoading(object sender, EventArgs e)
{
...
}
While your users are navigating your page elsewhere, upOnloading() will be executed every Timer.Interval milliseconds.
i have a radio button when selecting it, dropdown list is getting visible. I want this process without postback and by using Update Panel.
After using radioRatingBool_CheckedChanged event, dropdown is visible but with postback.
but i need it without postback.
here is radiobutton:
<asp:RadioButton ID="radioRatingBool" Text="Bool" runat="server" OnCheckedChanged="radioRatingBool_CheckedChanged" AutoPostBack="true" />
and here is function:
protected void radioRatingBool_CheckedChanged(object sender, EventArgs e)
{
if (IsPostBack)
{
if (radioRatingBool.Checked == true)
ddlRating.Visible = false;
else
ddlRating.Visible = true;
}
}
please help me as soon as possible. Thanks
use the following :
Add the refernce of ASP.net Ajax assembly
then..
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel>
<contentTemplate>
Put your contents here..the radio button and drop down
<contentTemplate>
</asp:UpdatePanel>
Make sure AutoPostback is set to true
You can wrap your Radio Button and Dropdownlist inside the following html
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<!-- Your Controls... -->
</ContentTemplate>
</asp:UpdatePanel>
Check the following links for more information on how to use the UpdatePanel control and the ScriptManager control.
Update Panel : http://msdn.microsoft.com/en-us/library/system.web.ui.updatepanel.aspx
Script Manager : http://msdn.microsoft.com/en-us/library/system.web.ui.scriptmanager.aspx
Update Panel Tutorial : http://msdn.microsoft.com/en-us/library/bb399001.aspx
I have some sort of a strange problem, I have an update panel which is triggerd by a timer.
Also I have on this page is a function that calls the DB and retrieves data from it. the function does not being called from the update panel or even related to it.
the problem is that I see in my log file that every time there is a tick and the update panel being updated there is also a call to my DB server (this function is in the page_Load section ) to retrieve the data again. but the page doesn't seem to do a full postback (It stays the same and doesn't looks like being reloaded)
my code:
<asp:Timer runat="server" id="UpdateTimer" interval="5000" ontick="UpdateTimer_Tick" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger controlid="UpdateTimer" eventname="Tick" />
</Triggers>
<ContentTemplate>
<span id="s1" runat="server"></span>
</ContentTemplate>
</asp:UpdatePanel>
and code behind:
protected void UpdateTimer_Tick(object sender, EventArgs e)
{
DateTime dt = TimeConvertor.getCurrentGameTime();
s1.InnerText = String.Format("Current game time: {0:dd/MM/yyyy HH:mm}", dt);
}
The function to retrieve data from the DB is in the page_load of the page.
Any help is appreciated
Thank you
Doron
Using the Update panel doesn't refresh whole page, only controls inside update panel, but when Partial Update is executed all the server page life-cycle events occur, and view-state and form data are preserved, but when rendering page only part of update panel is rendered and returned to user.
Go to this link Partial page rendering
and scroll to the section background.
I have an ASP.NET listbox, lstActivities. To edit an item in the list, users can either click lnkButton or double-click on the listbox. I achieve this with:
protected void Page_Load(object sender, EventArgs e) {
if (IsPostBack) return;
var refDblClick = ClientScript.GetPostBackEventReference(lnkButton, "dblClick");
lstActivities.Attributes.Add("ondblclick", refDblClick);
}
protected override void Render(HtmlTextWriter writer)
{
ClientScript.RegisterForEventValidation(lnkButton.UniqueID, "dblClick");
base.Render(writer);
}
I would like to change this so that the postback is asynchronous, using AJAX. At the moment, the listbox and button are in an UpdatePanel so there is an async postback when the button is clicked. But when the listbox is double-clicked, a full postback occurs.
<asp:UpdatePanel ID="up" UpdateMode="Conditional" ChildrenAsTriggers="true"
runat="server">
<ContentTemplate>
<asp:ListBox ID="lstActivities" runat="server"></asp:ListBox>
<asp:LinkButton ID="lnkButton" runat="server" OnClick="lnkButton_Click">
Edit</asp:LinkButton>
</ContentTemplate>
</asp:UpdatePanel>
How can I make the double-click refresh only the UpdatePanel?
A few things to try:
<asp:UpdatePanel ID="up" UpdateMode="Conditional" ChildrenAsTriggers="true"
runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="lstActivities" />
<asp:AsyncPostBackTrigger ControlID="lnkButton" />
</Triggers>
.........
</asp:UpdatePanel>
or
protected void Page_Load(object sender, EventArgs e) {
if (IsPostBack) return;
var refDblClick = ClientScript.GetPostBackEventReference(lnkButton, "dblClick");
lstActivities.Attributes.Add("ondblclick", refDblClick);
ScriptManager1.RegisterAsyncPostBackControl(lstActivities);
}
I just a ran a quick test with the code you provided and I do get "partial postbacks" (for lack of a better term since updatepanels always do full postbacks) on both, the clicking of the button and the double clicking of the list.
If you set other panels in that page to UpdateMode="Conditional" as you are doing with your UpdatePanel "up", then only elements inside "up" will be updated. If you don't specify the update mode on the other panels, then they will always be updated on postback, because, again, update panels ALWAYS do full postbacks; what they really do is partial refreshes of the page.
Linking MSDN documentation regarding UpdatePanel as I think is a very helpful read.
I tried the solutions suggested, but with no luck. It's quite a complicated page with lots of UpdatePanels so hard to work out the exact problem.
In the end I went for jQuery:
$(document).ready(function () {
$(document).delegate('#ctl00_body_lstActivities', 'dblclick', function () {
eval($('#ctl00_body_lnkButton').attr('href'));
});
});
I want to do page load every 5 sec so I have this in my head content
<meta http-equiv="refresh" content="5" />
Because of this the whole page refreshes. I just want to refresh the gridview and the graph that I have in the page. How can I do that without refreshing the whole page.
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" EnablePageMethods="true" EnablePartialRendering="True"
runat="server">
</asp:ToolkitScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<div id="pie">
<canvas width="125" height="450" id="progress1">[No canvas support]</canvas>
<canvas id="pie1" position="relative" width="400" height="400">[No canvas support]</canvas>
</div>
<asp:Panel runat="server" ID="Panel_Users">
<asp:GridView ID="Grid_UserTable" runat="server"
OnRowDataBound="MyGrid_RowDataBound">
<Columns> </Columns>
</asp:GridView>
</asp:Panel>
<asp:Timer ID="TimerClickEvent" runat="server" Interval="4000" ontick="TimerClickEvent_Tick"></asp:Timer>
</ContentTemplate>
</asp:UpdatePanel>
protected DateTime LastUpdate
{
get
{
return (DateTime)(ViewState["LastUpdate"] ?? DateTime.Now);
}
set
{
ViewState["LastUpdate"] = value;
}
}
protected void TimerClickEvent_Tick(object sender, EventArgs e)
{
if (LastUpdate.AddSeconds(5.0) < DateTime.Now)
{
UpdatePanel1.Update();
LastUpdate = DateTime.Now;
}
}
protected void Page_Load(object sender, EventArgs e)
{
ToolkitScriptManager1.RegisterAsyncPostBackControl(TimerClickEvent);
if (!IsPostBack)
{
LastUpdate = DateTime.Now;
}}
Doesn't reload. where am I going wrong
Place the panel inside an UpdatePanel and use method updatePanelID.Update() to update the update the Panel containing GridView. See this for more details
Instead of button click event you can use a timer for that.
If you only want to refresh a region, there are 2 options:
load that into an <iframe> and let it do whatever it wants (via meta-refresh on the document inside the <iframe>
reload the implacted region via javascript, perhaps jQuery's .load() method, i.e. $('#id').load(url);
A meta-refresh on the entire page will, by necessity, reload the entire page.
For a built in asp.net solution, use an <asp:UpdatePanel> along with an <asp:Timer> control.
Set the update panel to update based on the Timers Tick event. This will then only update the content within the update panel.
HOWEVER, this is a quick and dirty solution (in my opinion) because even though the content on the page only updates within the update panel, the whole page is actually posted back each time, and anything within the Page_Load method will be processed again.
Another solution would be to use some javascript ajax, and only update what you need to update. A great javascript library which will help you with this is jQuery, and then use the AJAX features of this. This will allow you to reload on the areas that you need, and give you far greater control over what is happening.
I would forget about the AJAX Control Toolkit, and look more into jQuery Ajax and jQuery UI.