Entire Page refreshes even though gridview is in an update panel - asp.net

I have a gridview that is within an updatepanel for a modal popup I have on a page.
The issue is that the entire page refreshes every time I click an imagebutton that is within my gridview. This causes my entire page to load and since I have grayed out the rest of the page so that the user cannot click on it this is very annoying.
Does any one know what I am missing.
Edit: I entered a better solution at the bottom

Make sure you have the following set on the UpdatePanel:
ChildrenAsTriggers=false and UpdateMode=Conditional

do you have ChildrenAsTriggers="false" on the UpdatePanel?
Are there any javascript errors on the page?

I had this problem and came across the following article:
http://bloggingabout.net/blogs/rick/archive/2008/04/02/linkbutton-inside-updatepanel-results-in-full-postback-updatepanel-not-triggered.aspx
My button wasn't dynamically created in the code like in this example, but when I checked the code in the aspx sure enough it was missing an ID property. On adding the ID the postback became asynchronous and started to behave as expected.
So, in summary, check your button has an ID!

Are you testing in Firefox or IE? We have a similar issue where the entire page refreshes in Firefox (but not IE). To get around it we use a hidden asp:button with the useSubmitBehavior="false" set.
<asp:Button ID="btnRefresh" runat="server" OnClick="btnRefresh_Click" Style="display: none" UseSubmitBehavior="false" />

Several months later this problem was fixed. The project I was working in was a previous v1.1 which was converted with 2.0. However, in the web.config this line remained:
<xhtmlConformance mode="Legacy"/>
When it was commented out all of the bugs that we seemed to have with the ajax control toolkit disappeared

Is the Modal Window popped up using the IE Modal window? Or is it a DIV that you are showing?
If it is an IE Modal Pop up you need to ensure you have
<base target="_self" />
To make sure the post back are to the modal page.
If it is a DIV make sure you have your XHTML correct or it might not know what to update.

I would leave the onClick and set it as the trigger for the updatePanel.
That's odd that it works in FF and not IE. That is opposite from the behavior we experience.

UpdatePanels can be sensitive to malformed HTML. Do a View Source from your browser and run it through something like the W3C validator to look for anything weird (unclosed div or table being the usual suspects)
If you use Firefox, there's a HTML validator Extension/AddOn available that works quite nicely.

For reference..
I've also noticed, when using the dreaded <asp:UpdatePanel ... /> and <asp:LinkButton ... />, that as well as UpdateMode="Conditional" on the UpdatePanel the following other changes are required:
ViewStateMode="Enabled" is required on <asp:Content ... /> (I've set it to Disabled in the MasterPage)
ClientIDMode="Static" had to be removed from <%# Page ... />

To prevent post-backs add return false to the onclick event.
button.attribute.add("onclick","return false;");
Sample:
string PopupURL = Common.GetAppPopupPath() + "Popups/StockChart.aspx?s=" + symbol;
hlLargeChart.Attributes.Add("onclick", String.Format("ShowPopupStdControls(PCStockChartWindow,'{0}');return false;", PopupURL));

Related

gridview with many pages returned not maintaining scroll position

I have an issue with maintaining scroll position.
I am almost positive that I have everything set correctly. I have updated my web config...
<pages maintainScrollPositionOnPostBack="true"
and everything seems to work fine UNTIL....
When ever my Gridview returns a lot of pages, like more than 50, sometimes upwards of 100 or more, I show 50 records per page. The farther into the Gridview, the more the scroll position is off.
So what I am saying is that for the first 20 plus pages or so, if I scroll down the page to the point where the top rows have moved off the screen and I enter Edit Mode, the correct record remains in view on Postback.
But if I am over say around 30 pages into the Gridview, the further in the worse it gets, when i enter Edit Mode I have to scroll back down to the location of the record that I selected to edit.
Any ideas on this one will be tested, my users are going nutts!!!
thanks again,
You could wrap the gridview in a div set with overflow:auto. Then with js reset the scroll position when the page loads. something like this.
<body onload="GetDivPosition()">
<form id="form1" runat="server">
<asp:HiddenField ID="hdnField" runat="server" Value="0" />
<div style="overflow:auto;" ID="gridArea" onscroll="SetDivPosition()">
<asp:GridView ID="yourGrid" runat="server">
.....
</asp:GridView>
</div>
<script language="javascript" type="text/javascript">
function GetDivPosition() {
var hdn = document.getElementById("hdnField");
document.getElementById("gridArea").scrollTop = hdn.value;
}
function SetDivPosition() {
var hdn = document.getElementById("hdnField");
hdn.value = document.getElementById("gridArea").scrollTop;
}
</script>
Visual studio will probably give you warnings that onscroll isn't valid but it has always worked for me. If your using an update panel it's a little more complicated. Actually all of mine are in update panels so I tried to revert this code back, so hopefully this will work for you.
The MaintainScrollPositionOnPostBack property only works in IE so unless this is an Intranet situation where everybody is using IE, then this is not a good solution. There are browserCaps hacks for other browsers but not even Microsoft supports this.
If you are using paging, then the simplest option is to reduce the number of records per page. Only other "clean" option remaining would be to roll your own jQuery solution.
Here's an approach without using the MaintainScrollPositionOnPostback property:
http://www.kodergurl.com/2010/08/maintain-scroll-position-on-post-back.html

Weird behavior of linkbutton within updatepanel

This problem is relevent apperantly to IE6 and maybe to newer versions im not sure. when you put a linkbutton inside an updatepanel like so:
<asp:ScriptManager runat="server"></asp:ScriptManager>
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:LinkButton runat="server">Test</asp:LinkButton>
</ContentTemplate>
</asp:UpdatePanel>
You run it and then play around with ctrl+mouse wheel and change the size of the site. Then click the linkbutton. It changes the size of the text of the website again to somekind of deffault size... Im wondering if someone knows how to fix this. And what is causing this problem
Edit: the problem was with a few users clicking the link and suddenly all the text on the page became very small and unreadable
You have nothing to fix here, this is a browser behavior.
But if you have a custom behavior that you change the text size, then you need to take care to save the last setting somewhere and then get the last setting and use it.

Button not processing onClick method

I have a button on an ascx control that calls a method on the onClick event:
<asp:Button id="bUpdateText" onClick="FUpdate" ValidationGroup="Update" CausesValidation="False" Text="Update" cssclass="button" runat="server" />
Normally I use this control on it's own page and the button works. This time round however, I am loading this control into a Div that is present on the home page of my site (that way I can show the contents with a little bit of JQuery). However, when I bring the control in this way, the onClick event doesn't fire and I am not sure what could cause that.
Sorry I don't have any code sample but the nature of the site makes it difficult to provide any that would make sense.
In short, what would stop this event firing now?
p.s I have tried adding validation groups to all other buttons and validation controls on the page and there is only ONE form present on the page.
EDIT: I have only just added the validation stuff in to see if that does anything. By default it has been like this and still didn't work:
<asp:Button id="bUpdateText" onClick="FUpdate" Text="Update" cssclass="button" runat="server" />
As mentioned as well, this works when I use this control on it's own page (loaded directly into Default.aspx) so I don't think the case of onClick matters.
EDIT2: I have just noticed that when I click this button, other validation controls on my page are being triggered even though they have their own DIFFERENT validation group?! Taking these controls out doesn't help though.
Thanks.
I have found out what is causing the issue.
This control that I am now including is called on the Page_Finalize() and I am guessing that by this point the viewstate has forgotten it needs to do anything. Loading this control on the page load sorts it out.
Thanks for looking.
To start, if you set the 'causesValidation' property to false, you do not need a validation group.
Additionally, I believe that ASP cares about case when dealing with the OnClick command.
i.e. it should be OnClick not onClick
Yeah, annoying and small, but that might be your problem
You can use Firebug to see what happen in Update validationGroup. it looks like your page execute only client-side button click because of Update validationGroup.

ASP.NET and Firefox: why doesn't clicking on a GridView ButtonField do anything?

I have a pretty simple ASP.NET Web Form that looks a bit like the following:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="example.aspx.cs" Inherits="example" %>
<form runat="server">
<asp:GridView runat="server" id="grid" AutoGenerateColumns="false" OnRowCommand="DoStuff">
<Columns>
<asp:ButtonField Text="Do stuff" />
</Columns>
</asp:GridView>
</form>
(In PageLoad I call grid.DataBind(), and the event handler DoStuff is unremarkable.)
When I view this in Internet Explorer and click the ButtonField (which renders as a link), the event handler fires as expected. When I click it in Firefox, nothing happens.
If I turn on Firebug's Javascript debugging console then click the link, it shows an error in the Javascript onclick handler that's auto-generated by ASP.NET:
theForm is undefined
__doPostBack("grid", "$0")
javascript:__doPostBack('grid', '$0')()
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {\r\n
Why does this happen and how can I make the ButtonField work in Firefox?
(N.B. I'm asking this question in order to answer it myself: I've already discovered why I was seeing the above error, and wanted to record it for the benefit of myself and others. Feel free to add other answers if you know other gotchas with ASP.NET and Firefox.)
This is due to a difference in how the browsers handle Javascript in the presence of invalid HTML: specifically, when the form is not surrounded with <html> and <body> tags. Without these tags, Firefox seems to try to initialise the variable theForm before the form actually exists.
Adding the proper <html> and <body> tags around the form (as is required for valid HTML in any case) makes the click handler work in both IE and Firefox.
Notes:
obviously invalid HTML is a worst practice for many other reasons. The page I was developing was intended to be used with a Master page which rendered the rest of the surrounding HTML, but (for various reasons) I was testing it in isolation from the Master page.
I tried reproducing the same problem with a simple <asp:Button runat="server">, but that triggers a full page-refreshing PostBack, so it doesn't hit the same error. Being a Web Forms n00b I don't know what's special about a GridView (or this use case) that makes it behave differently (i.e. sets up an onclick handler to handle the click without a page load).
I've marked this as wiki in case anyone else can explain this better than I.

Trying to self contain pop ups which use the AjaxToolkit ModalPopUpExtender

I have 3 different kinds of ajax popups that need to exist across my site. I was hoping that I could simply create a user control for each one and place the panel and modal popup extender inside each one but this doesn't seem to be working. Has anyone tried this before or do you have a recommendation as to how I can avoid duplicate code for each pop up on different pages? Thanks!
Ah I figured out my issue with the User Control I believe.
The ModalPopUpExtender requires the TargetID property to be set otherwise an error occurs. Since this is sitting in a UserControl I just created a dummy link button that doesn't do anything and I set the property visible to false.
<asp:LinkButton ID="lnkBlank" runat="server" Visible="false" />
<asp:Panel ID="plContainer" style="display: none;" runat="server">
Hello?
</asp:Panel>
<cc1:ModalPopupExtender ID="mpe" runat="server"
BehaviorID="test"
TargetControlID="lnkBlank"
PopupControlID="plContainer" />
Apparently it doesn't appreciate that and the moment I set the visible property to true it started working. Not sure what the reasoning is for a TargetID since, I would think, most pop ups could be called from multiple links about the page. Perhaps I'm still not entirely clear on how this control is supposed to be used.
One option would be to write the popups in a asp.net user control (a .ascx page) and include that on the pages you need the popups. Have a public method in the ascx page that will show the popup, and call it from the parent page when you need to. If you already have a script manager on the parent page, you can't have a second one in the ascx page, but other then that there shouldn't be anything that would stop this from working. Hope this helps!
edit: here's what my modal popup extender control looks like...
<cc1:ModalPopupExtender
ID="mpeClassroom"
BackgroundCssCLass="modalBackground"
runat="server"
CancelControlID="lbClose"
OnOkScript="onOk()"
TargetControlID="Button1"
PopupControlID="pnlClassroom">
</cc1:ModalPopupExtender>
in my code behind page, my method just calls mpeClassroom.Show();
The problem with hidden link as TrgetControlID is that; when u set its visibility as false, server doesn't render it as well. PopExtender then cannot find control on the page.
Instead of setting its visibility to false, try to apply a style with display:none. This should work !

Resources