Page with update panel doesnt show correct information when I back into the page

I have this page that I'd like to use update panels on. There are three controls on the page. I'd like to have the first dropdown control fire a second dropdown and then that one fire a gridview. I'd like the 2nd dropdown and the gridview to be in update panels. So when a user makes a general category selection in the first dropdown, the 2nd one will list the more specific categories (those related to the first dropdown selection) and then when the user picks a more specific category the gridview is filled with with data specific to that 2nd more specific category. I've got this all working fine. The the user clicks the "details" link in the gridview and they see full details about their selection from the gridview. But then when they click the "back" button in their browser, it takes them back to the page with the 2 dropdowns and the gridview but it's not in the state they left it. Ideally, they should see the same thing they saw before they clicked the "details" link.... their first selection int he first dropdown, their more specific category in the 2nd dropdown and the gridview filled with info relating to that 2nd dropdown. But that's not what I get. What am I missing?

hello.

well, you're not missing anything. it's simply the way ajax pages work. i think that you should take a look at the history control available on the future bits

http://msmvps.com/blogs/luisabreu/archive/2007/05/07/may-future-bits-the-history-control.aspx

Paged GridView in update panel doesnt work

Hi, I have paged grid view inside an update panel but when I try to change the page in the grid view nothing happens, any ideas why? thanks for your help.

Could you post your code so we can see exactly what you are doing?

Yes, here is the gridviewcode

<asp:GridView ID="GridView1" runat="server" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="1" AllowPaging="True" OnPageIndexChanging="GridView1_PageIndexChanging" PageSize="12" AutoGenerateColumns="False">
<FooterStyle BackColor="White" ForeColor="#000066" />
<RowStyle ForeColor="#000066" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
<Columns>
<asp:BoundField DataField="# Cuota" HeaderText="# Cuota" />
<asp:BoundField DataField="Saldo Inicial" HeaderText="Saldo Inicial" />
<asp:BoundField DataField="MontoInteres" HeaderText="Monto Interes" DataFormatString="{0:C}" HtmlEncode="False" />
<asp:BoundField DataField="Monto Cuota" HeaderText="Monto Cuota" />
<asp:BoundField DataField="MontoCapital" HeaderText="Monto Capital" DataFormatString="{0:C}" HtmlEncode="False" />
</Columns>
</asp:GridView>

The grid view gets filled with data, it just wont let me browse through the grid view pages and it works outside the update panel.

Nevermind, outside the update panel it just postbacks but I hadnt notice the information is the same. I dont have any eventhandler set on the gridview.

I made it work. I just added this code

protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
{

GridView1.DataSource = ViewState["DataTable"] as DataTable ;
GridView1.PageIndex = e.NewPageIndex;
GridView1.DataBind();
}

Thanks for your help.

PageRequestManager updatePanelIds issue

Hi,

I'm trying to use and update panel on a page that uses a master page. I've noticed that the uniquePanelId's in the pageRequestManager xml-script are separated by ":" not by "$". Because of this atlas is not finding my update panel.

1. Is there a setting I'm missing that determines what the separator is?

2. If not the above is there a way to modify the atlas.js function uniqueIdtoClientId to include the ":" character? right now the code is:

function uniqueIDToClientID(uniqueID) {return uniqueID.replace(/\$/g,'_');

}

3. Or any other suggestions.

This only seems to happen when I use a master page.

Has anyone ever come up for a soluation to this problem?

I'm running into it with an update panel being on a user control.

PageRequestManager Question

Hello,

I have an update panel which contains a gridview control. When the update panel refreshes or there is a partial postback I would like an indicator that this event has occured in my client side script. I plan to use an if/then statement based on this. I believe this can be done by using an instance of the PageRequestManager class. Could you provide an example of this?

Thanks,

-Robert

It sounds like this tutorial goes over what you're looking for:

http://ajax.asp.net/docs/tutorials/AnimateUpdatePanels.aspx

In your handler for the pageLoaded event, you use the panelsUpdated property to figure out which panels were updated. You can then show whatever indicator you want based on that information.

PageRequestManagerParserErrorException with the Update Panel

I have spent quite a bit of time researching this and I cannot figure it out. So if there is anybody that has any ideas I am all ears.

I have a pretty simple site that uses a few update panels. I am developing with VS2005 on XP all the patches and using ASP.NET AJAX 1.0. Everything works perfect on my dev machine and on second beta server I have. When everything get moved to the client site they get the "PageRequestManagerParserErrorException" error on the pages with the update panel. I am not using server.transfer or respnse.write() or any other known issues. The client machine is a test box that was imaged for this app. Running Win2003 all clean and up to date in a pretty standard configuration.

I am just looking for direction: I saw some posts about response caching and machinekey but I have no idea what to look for or what to direct the sys admin to look for.

Any help would be greatly appreciated.

Craig.

Have a look here for troubleshooting tips:http://weblogs.asp.net/leftslipper/archive/2007/02/26/sys-webforms-pagerequestmanagerparsererrorexception-what-it-is-and-how-to-avoid-it.aspx

Also see this related post:http://forums.asp.net/p/1038252/1439637.aspx

Hope these help...

-Damien

Damien,

Thanks for the links. In my searching I did come accross them (and meany others). So I threw up a server outside of my network that and tried to hit the pages with an update panel again. And this time I get the error (sometimes). It was strange that I would sometimes get an error and others I wouldn't. So I installed fiddler to see what the response was like. When I get an error I notice this in the respose;

[HttpException (0x80004005): Server cannot modify cookies after HTTP headers have been sent.]
System.Web.HttpCookieCollection.Add(HttpCookie cookie) +103
System.Web.Security.RoleManagerModule.OnLeave(Object source, EventArgs eventArgs) +650
System.Web.SyncEventExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute() +92
System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously) +64

I am using a master page that will show differnt information based on the user's role. My guess is that the injection of this error into the response is causing the problem because when it works there is no error. Unfortunatly I don't know what this means yet. Guess it's back to the internet for some studying.

If anybody has any sugestions or direction on addressing this issue I would welcome the advice.

Regards,

Craig

Got it!

This link was the answerhttp://forums.asp.net/p/1069056/1556225.aspx#1556225

I still need to read up on the issue but the answer was to set the cacheRolesInCookie=false in the web.config file. Made the change and all is good. Although, I now wonder what the impact is now on perfomance.

Craig

PageRequestManagerServerErrorException with 500 error code

In javascript I'm setting the value property of a button within an update panel before calling click() on the button to refresh the update panel. (I need to refresh an update panel and pass extra data on the callback, and no one on this forum has yet described a better way of doing it than this.)

This was all working in tests that I did last week, but I'm now getting the following error message box in IE:

"Sys.WebForms.PageRequestManagerServerErrorException: An unkown error ocurred while processing the request on the server. The status code returned from the server was: 500"

Any ideas?

I have the same error but on a couple of dropdown which update one another's datesource with updatePanels.

If i change the value of the first dropdown for several times, always the third tine gives this error.

I found on a post the setting TRACE off resolves but not for me.

Any ideas ?

Just try to change frequently some controls which use updatepanels (for other controls) and see what's happen.

Thank's

Sorin

I found also that If I have more than 3 UpdatePanels in a Page I get this error after 3 callbacks.

If I have on page Trace="false"and "EnableEventValidation="true"

I get this error:

Invalid postback or callback argument. Event validation is enabled using <pages enableEventValidation="true"/> in configuration or <%@. Page EnableEventValidation="true" %> in a page. For security purposes, this feature verifies that arguments to postback or callback events originate from the server control that originally rendered them. If the data is valid and expected, use the ClientScriptManager.RegisterForEventValidation method in order to register the postback or callback data for validation.

Thank's again

I've also tried setting the value of a hidden field and a hidden textbox and both raise the same error.

I cannot even paste data into a textbox and then do a postback without getting this error.

I'm also EXTREMELY TIRED OF MICROSOFT IGNORING ALL OF MY POSTS!!!!!!!!!!!

Paging and UpdatePanel

Hi,

If you look at this page you see an example of paging within an update panel which works well

http://mattberseth2.com/resizeable_gridview_columns/

The difference I have is I also have ajaxToolkit:HoverMenuExtender on my first column which popups 'Edit Details' text which takes you to a new page...

without any triggers on the updatepanel, my paging now works as the above example.. but when I use my hover menu and click on 'Edit Detail' I get the following error..

Sys.WebForms.PageRequestManagerParserErrorException: The message received from the server could not be parsed. Common causes for this error are when the response is modified by calls to Response.Write(), response filters, HttpModules, or server trace is enabled. Details: Error parsing near '

to fix this error I use the following trigger on the updatepanel

<Triggers>
<asp:PostBackTrigger ControlID="GridView1" />
</Triggers>

now when I click on Edit Details it takes me to the new page as intended... but when I click on my paging buttons it doesnt work within the update panel it causes full page reload..

any ideas to get these two working together would be appreciated...

I have newver try that, I actually just added the GridView inside an UpdatePanel and seem to work really well

Hi,

Generally, I think implement it as Albert suggested should work.

If still not, please provide a simple repro that demonstrate the first problem(Sys.WebForms.PageRequestManagerParserErrorException: The messagereceived from the server could not be parsed. Common causes for thiserror are when the response is modified by calls to Response.Write(),response filters, HttpModules, or server trace is enabled. Details:Error parsing near ' ).

Hi,

simple repro.. would be to grab the example from the above link... and add following hovermenu to first column... add pagertemplate below...

paging works fine within the updatepanel

on clicking edit details you get the error as described in the first post...

to fix this error I use the following trigger on the updatepanel

<Triggers>
<asp:PostBackTrigger ControlID="GridView1" />
</Triggers>

but now the paging causes full page post back..

adding thelnkBtnRowEditDetail as a trigger as well dosent work as that gives a control id cant be found error.

 <asp:TemplateField ShowHeader="False"> <ItemTemplate> <asp:Panel CssClass="popupMenu" ID="PopupMenuCustomerName" runat="server"> <div class="popupMenuButtons"> <asp:LinkButton ID="lnkBtnRowEdit" SkinID="SmallTextPopUp" runat="server" CommandName="Edit" Text="Edit
</asp:LinkButton> <asp:LinkButton ID="lnkBtnRowEditDetail" SkinID="SmallTextPopUp" runat="server" CommandName="EditDetail" Text="Edit Detail"></asp:LinkButton> </div> </asp:Panel> <asp:Panel ID="PanelCustomerName" runat="server"> <asp:ImageButton ID="ImgButton" runat="server" AlternateText="Edit" ImageUrl="~/images/icon_edit.gif" CausesValidation="false" CommandName="" /> </asp:Panel> <ajaxToolkit:HoverMenuExtender ID="hme3" runat="Server" HoverCssClass="popupHover" PopupControlID="PopupMenuCustomerName" PopupPosition="Left" TargetControlID="PanelCustomerName" PopDelay="15"> </ajaxToolkit:HoverMenuExtender> </ItemTemplate> <EditItemTemplate> <asp:Panel CssClass="popupMenu" ID="PopupMenuCustomerName" runat="server"> <div class="popupMenuButtons"> <asp:LinkButton ID="lnkBtnRowUpdate" SkinID="SmallTextPopUp" runat="server" CommandName="Update" Text="Update"></asp:LinkButton><br /> <asp:LinkButton ID="lnkBtnRowCancel" SkinID="SmallTextPopUp" runat="server" CommandName="Cancel" Text="Cancel"></asp:LinkButton> </div> </asp:Panel> <asp:Panel ID="PanelCustomerName" runat="server"> <asp:ImageButton ID="ImgButton" runat="server" AlternateText="Update/Cancel" ImageUrl="~/images/icon_edit.gif" CausesValidation="false" CommandName="" /> </asp:Panel> <ajaxToolkit:HoverMenuExtender ID="hme3" runat="Server" HoverCssClass="popupHover" PopupControlID="PopupMenuCustomerName" PopupPosition="Left" TargetControlID="PanelCustomerName" PopDelay="15"> </ajaxToolkit:HoverMenuExtender> </EditItemTemplate> </asp:TemplateField>

 <PagerTemplate> <div class="item"> <div class="item_left"> <asp:Label ID="lblPageTxt" runat="server" SkinID="PageSmallText" EnableViewState="false" Text="Page" ></asp:Label> <asp:DropDownList ID="PageDropDownList" runat="server" AutoPostBack="true" OnSelectedIndexChanged="PageDropDownList_SelectedIndexChanged" /> <asp:Label ID="lblOfTxt" runat="server" SkinID="PageSmallText" EnableViewState="false" Text="of"></asp:Label> <asp:Label ID="lbTotalPages" runat="server" SkinID="PageSmallText"></asp:Label> </div> <div class="item_right"> <asp:ImageButton ID="imgbtnFirst" runat="server" CommandName="Page" CommandArgument="First" ImageUrl="~/images/arrow_up.gif"></asp:ImageButton> <asp:ImageButton ID="imgbtnPrev" runat="server" CommandName="Page" CommandArgument="Prev" ImageUrl="~/images/arrow_left.gif"></asp:ImageButton> <asp:ImageButton ID="imgbtnNext" runat="server" CommandName="Page" CommandArgument="Next" ImageUrl="~/images/arrow_right.gif"></asp:ImageButton> <asp:ImageButton ID="imgbtnLast" runat="server" CommandName="Page" CommandArgument="Last" ImageUrl="~/images/arrow_down.gif"></asp:ImageButton> </div> <div class="clear"></div> </div> </PagerTemplate>

not using the hovermenu isnt really an option... as this functionality is consistent with the rest of the site... unless you have another idea for reproducing this functionality

first column of our gridviews are a basic icon image... with a hover menu that has 'Edit' which edits gridview inline 'Edit Details' which goes to a new page ... they also have 'Clone' which provides a modal popup and 'Create Link'/'Remove Link' and other such functionlaity... which is available from the gridview using the hovermenu.

Would you mind showing a repro that I can run directly?

Hi Paul

I looked at the example at

http://mattberseth2.com/resizeable_gridview_columns/

and it looks great.
Can you share your code?

Thanks

Shalom

there is example code on that link... http://mattberseth2.com/resizeable_gridview_columns/

Paging in GridView gets Object Expected Error

I have a grid in an update panel that gets databound at runtime (to index server results). I have implemented paging and it works without atlas. As soon as I place that grid in update panel, paging stops working. All I get is a javascript error saying "line 1 :Object Requiered".

I have tried debugging it but on paging, it doesn't event get to the server.

thanks

Hi Biren,

Have you tried this with the April CTP of Atlas that was released earlier this week?

If it's still a problem, can you please provide some more details on your scenario so that we can investigate?

Thanks,

Eilon

I have done it and it works for me. Object required is a pretty generic error just as the "Object reference not set to an..." in .Net. It could be because of wrong syntax in javascript or html that you might have on the page.

If you don't mind pasting the code on the forum please do so we can look at it.

Just tried it and same error.

here is the code:

<%@. Page Language="VB" AutoEventWireup="false" CodeFile="Index.aspx.vb" Inherits="Index" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Search</title>
<link href="http://links.10026.com/?link=Style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<atlas:ScriptManager EnablePartialRendering="true" ID="atlas1" runat="server" EnableViewState="true" />
<form id="frm1" runat="server">

<atlas:UpdateProgress ID="up11" runat="server" >
<ProgressTemplate >
<table>
<tr>
<th style="color:red">Please wait while your serach results are calculated...</th>
</tr>
<tr>
<td>
<img src="http://pics.10026.com/?src=images/spinner.gif" /></td>
</tr>
</table>

</ProgressTemplate>
</atlas:UpdateProgress>
<atlas:UpdatePanel ID="up1" Mode="conditional" runat="server" >
<ContentTemplate >



<table>
<tr>
<th>A word or phrase in the file: </th><td><asp:TextBox ID="txtsearch" runat="server" /></td>
</tr>
<tr>
<th>All or part of filename: </th><td><asp:TextBox ID="txtfilename" runat="server" /></td>
</tr>
<tr>
<th>When was it modified?:</th>
<td>
<asp:DropDownList ID="lstDuration" runat="server">
<asp:ListItem Text="Don't remember" Value="0" />
<asp:ListItem Text="Within the last week" Value="7" />
<asp:ListItem Text="Past Month" Value="30" />
<asp:ListItem Text="Within the past year" Value="365" />
</asp:DropDownList>
</td>
</tr>
<tr>
<td colspan="2"><asp:Button ID="btnSubmit" runat="server" Text="Search" /></td>
</tr>
</table>

<asp:GridView ID="grdResults" runat="server" CellPadding="4" ForeColor="#333333"
GridLines="None" AllowSorting="True" AllowPaging="True" PageSize="2" AutoGenerateColumns="False">
<Columns>
<asp:TemplateField HeaderText="Document Information">
<ItemTemplate>
<p>
<a href="http://links.10026.com/?link=<%# DataBinder.Eval(Container, "DataItem.path")%>">
<%# DataBinder.Eval(Container, "DataItem.Path")%>
</a>
<br />
<i>Last modified:
<%# DataBinder.Eval(Container, "DataItem.Write")%>
</i>
<br />
</p>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<EditRowStyle BackColor="#999999" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
</asp:GridView>

</ContentTemplate>

</atlas:UpdatePanel>
</form>
</body>
</html>

Code behind:

Partial Class Index
Inherits System.Web.UI.Page

Protected Sub btnSubmit_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnSubmit.Click

' Bind DataGrid to the DataSet. DataGrid is the ID for the
' DataGrid control in the HTML section.
Dim source As New DataView(createDS.Tables(0))
grdResults.DataSource = source
grdResults.DataBind()

End Sub
Private Function createDS() As DataSet
Dim cnnOledb As New OleDb.OleDbConnection
Dim strQuery As String

Dim critstr As String = "(contains(filename,'.doc OR .xls OR .ppt OR .asp OR .aspx OR .txt'))"

If txtsearch.Text.Length <> 0 Then
critstr += " AND (contains(contents,'" + condition(txtsearch.Text) + "'))"
End If

strQuery = "Select DocTitle,Filename,VPath,Rank,Characterization,Write,path from SCOPE() where " + critstr + " order by write desc"

Dim connString As String = "Provider=MSIDXS;Data Source='o drive'"

Dim cn As New System.Data.OleDb.OleDbConnection(connString)
Dim cmd As New System.Data.OleDb.OleDbDataAdapter(strQuery, cn)
Dim objDS As New DataSet

cmd.Fill(objDS)

Return objDS
End Function

Function condition(ByVal srchstr As String) As String
Dim arr As String() = srchstr.Split(" ")
For i As Integer = 0 To arr.Length - 1
Dim str1 As String = arr(i)
If str1 <> "AND" And str1 <> "OR" And str1 <> "NOT" Then
arr(i) = "\" + str1 + "\"
End If
Next
Return String.Join(" AND ", arr)
End Function

Sub grdResults_PageIndexChanging(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewPageEventArgs) Handles grdResults.PageIndexChanging
grdResults.PageIndex = e.NewPageIndex
Dim source As New DataView(createDS.Tables(0))
grdResults.DataSource = source
grdResults.DataBind()

End Sub
End Class

Hi again,

I tried this out and I'm getting the same error. This turns out to be a known bug in the April CTP of Atlas. To work around it, add this code to your Page's Load event handler:

Page.ClientScript.GetPostBackEventReference(this, String.Empty);

Thanks,

Eilon

that works. Thank you. btw ATLAS ROCKS!!

Appears to be an issue in the June CTP too... and if it wasn't for this post, I'd still have the issue.

Thanks guys

Correct, this was not fixed in the June CTP. For now the one line workaround should still be sufficient.

Thanks,

Eilon

In the case of nested UserControls, does this workaround apply? If so, where should the workaround go?

I have a page which contains a UserControl, which in turn contains another UserControl, which contains a GridView wrapped in an UpdatePanel. I tried adding this line to the page's Page_Load and the UserControl's Page_Load, but I get the same generic error:

Line: 10846
Char: 17
Error: Object required
FYI, the offending line appears to be the second one pasted below:

function destroyTree(element, markupContext) {

if (element.nodeType == 1) {

Any ideas?

slp004, can you please give more details as to what you're trying to do? It sounds like other people on this thread have this scenario working so I'm curious what's going on here.

Thanks,
Eilon

I was never able to figure out exactly what the problem was, but by breaking the page up into a number of smaller pages sharing a single master page it started working again. There were just way too many UserControls inside GridView inside FormView inside UserControls inside View areas inside show/hide panels... you get the idea.

I have exactly the same problem - in the same line

 function destroyTree(element, markupContext) {if (element.nodeType == 1) {

My page have three or four levels of nested user controls inside the update panel. The curious thing is the page with the same controls has worked before some change I did - now I am trying to figure it out.

Wow, I figured out the issue.

The error was caused because I have another updatepanel in this page - inside a user control, included in master page. The user control has Visible=false. This scenario causes the error. When I set the user control visibility to true, the error goes off.

The solution is setting the updatepanel (that is inside the user control) mode to Conditional. This solves the problem even if the user control is invisible.

HTH.

I had the same problem and I set all the update panels to conditional and it worked.

Paging using AJAX ASP.NET & DATAGRID

Hi all,

I am facing a problem ofPAGING in ajax with asp.net. I am not able to create paging on my web page. I have used update panel to view the data in datagrid.

I tried paging but its not working. Please suggest a solution to the above problem

Regards, Prem

Hi Prem,

I have a gridview and the Paging (WITHOUT causing postbacks) works just fine!

Did you check if all the callback options on the grid are disabled (enableSortingAndPagingCallbacks = false !!) ?
Then you just need to place it in an updatepanel.

If it still doesn't work, could you make me a (WORKING) demo with your grid which replicates the error/malfunction?

Kind regards,
Wim

Paging(GridView) Inside update Panel

When I enable Paging for a GridView inside a Update Panel for Jan. CTP I get a JavaScript error when I try to page. Is there a work around for this?

Thanks!

Things are working fine with me. I dont know what's the problem in your project.

A.

Panel close button with AJAX

Hello All,

I want to use this wonderful AJAX Framework to something very simple:

Inside an UpdatePanel I have a Panel. Now just below the Panel I want to place a button or link that when clicked will hide the Panel and do this client side (without requiring a post back). I know how to do this with a postback and a method that sets Panel.Visible = false, but I don't want to call the server for this, just hide the Panel client side.

So I ask to the MS AJAX experts out there: what is the easy and elegant way of doing this with MS AJAX Framework and/or AJAX Control Toolkit.

Thank you!

David

Use this JS for the button/link click: $get('PanelClientID').style.display = 'none';

Hi Neutrino,

My understanding of what your want is to make your panel which is indside an UpdatePanel without any postbacks. If I have misunderstood, please feel free to let me know.

You can use $get(Panel's ClientID).style.display = 'none'. Here is the sample:

<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"></script><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px"><%=DateTime.Now.ToString()%> </asp:Panel> <asp:Button ID="Button1" runat="server" Text="Button"OnClientClick="return hidePanel()"/> </ContentTemplate> </asp:UpdatePanel> <script type="text/javascript" language="javascript">function hidePanel(){ $get("<%= Panel1.ClientID%>").style.display='none'; return false; } </script> </form></body></html>

Note: Please pay special attention to the part of "Bold". IfOnClientClick don't return false, a postback will be occured in this case.

Best regards,

Jonathan

Thanks to both. Great simple solution.

panel collapse expand problem

i have several panels one below other which can be expanded and collapsed. suddenly the panels have stopped sliding down if a collapsed panel above them is expanded, although the panel expands (but hidden behind the panels below it). wht cud have happened? (i have not absolutely positioned the panels)

also, can somebody point me to a link tht explains 'display' property in CSS, with it's different options (inline, inline-table, block etc.) through examples?

Have you set the display property to none on the panel? The Toolkitsample website demo pages use a set of CollapsiblePanels stacked and you scenario should be able to do the same.

Here is alink to the msdn documentation on the css style display property.

Panel Closed

Hello

I use the autocompletextender and the CompletionListElementID="myPanel" because I want to use a scrollable area

my entire code is like this

 <asp:Panel runat="server" id="myPanel" Height="100px" ScrollBars="Vertical" ></asp:Panel> <ajaxToolkit:AutoCompleteExtender runat="server" ID="autoComplete1" TargetControlID="TBSearch" ServicePath="AutoComplete.asmx" ServiceMethod="GetCompletionList" MinimumPrefixLength="1" CompletionInterval="1" EnableCaching="true" CompletionSetCount="12" CompletionListElementID="myPanel" />

and I have a problem (of course)

The Panel open itself well and I get a scrollbar but when I click on the scrollbar to make it moving, the panel get closed.

Any ideas `?

Thx in advance 

Hi Gilloux,

I have wrote a sample based on your description but unable to reproduce your problem. My testing shows that scrollbar works fine. When click on it, the panel won't get closed unless you click on the list.

Here is my sample:

Aspx:

<form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:TextBox ID="TBSearch" runat="server"></asp:TextBox> <asp:Panel runat="server" ID="myPanel" Height="100px" ScrollBars="Vertical"> </asp:Panel> <ajaxToolkit:AutoCompleteExtender runat="server" ID="autoComplete1" TargetControlID="TBSearch" ServicePath="AutoComplete.asmx" ServiceMethod="GetCompletionList" MinimumPrefixLength="1" CompletionInterval="1" EnableCaching="true" CompletionSetCount="12" CompletionListElementID="myPanel" /> </form>

WebService:

<%@. WebService Language="C#" Class="AutoComplete" %>using System;using System.Web;using System.Web.Services;using System.Web.Services.Protocols;using System.Collections.Generic;[WebService(Namespace = "http://tempuri.org/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)][System.Web.Script.Services.ScriptService]public class AutoComplete : System.Web.Services.WebService { public AutoComplete() { } [WebMethod] public string[] GetCompletionList(string prefixText, int count) { if (count == 0) { count = 10; } if (prefixText.Equals("xyz")) { return new string[0]; } Random random = new Random(); List<string> items = new List<string>(count); for (int i = 0; i < count; i++) { char c1 = (char)random.Next(65, 90); char c2 = (char)random.Next(97, 122); char c3 = (char)random.Next(97, 122); items.Add(prefixText + c1 + c2 + c3); } return items.ToArray(); }}

My system environments: VS2005 + Asp.Net 2.0 Ajax Extensions V1.0 + Ajax Control Toolkit V10618 +Windows 2003.

Please compare your code with mine.If it doesn't work, please confirm whether your Control Toolkit Version is the latest release version or not. If not , please upgrade it.

Hope this help.

Best regards,

Jonathan

Panel disappear after manually update

Hi,

Here is my scenerio

<updatepanel1>

<div>

..............

</div>

<mainPanel1>

<updatepanel2>

<panel visible='true'>

<linkbutton id='lbtnSetVisibleUpdatePanel3' />

</panel>

</updatepanel2>

<updatepanel3>

<linkbutton id='lbtnSetVisibleUpdatePanel2' />

</updatepanel3>

<button id='setVisibleMainPanel2' />

</mainPanel1>

<mainPanel2 visible='false'>

<button id='setVisibleMainPanel1' />

</mainPanel2>

</updatePanel1>

When the page first loaded, mainPanel1 & updatePanel2 is visible. mainPanel2 & updatePanel3 is invisible. When I click on the button setVisibleUpdatePanel3, updatePanel3 will be set to visible and updatePanel2 will be set to invisible. It works fine. When I click on setVisibleMainPanel2 which will set visible mainPanel 2, and invisible mainPanel1, it works fine as well. The problem is when I click on button setVisibleMainPanel1 again which will set mainPanel1 visible again, and invisible mainPanel2, the updatePanel3 turn to nothing when I click on setVisiblePanel3. However, updatePanel2 is still there. Is is a problem related to nested update panel? Does anyone have this problem before?

Many thanks!

Have you got any solution ?

If yes please post it...

Hello,

I found that the updatepanel visible property is useless (in complex scenarios) so I have the same experience than yours.

/ Maybe the up visible property should works, only we've made mistakes. I don't know. /

However the solution is easy for me:

- never use the updatepanel visible property

- put a placeholder or a panel control inside each up, and use that control's visible property. Much cleaner and easier to follow what happens when you toggle the placeholders visible property.

Sorry, I am still trying to solve it. Does anyone have the solution?

testerASPNet:

The problem is when I click on button setVisibleMainPanel1 again which will set mainPanel1 visible again, and invisible mainPanel2, the updatePanel3 turn to nothing when I click on setVisiblePanel3. However, updatePanel2 is still there

Normally when you click lbtnSetVisibleUpdatePanel3 (which set visible=true/false on updatepanel3) it will update updatepanel2 only, updatepanel3 won't rendered until something trigger an updatepanel1 refresh.

I think what you really need in lbtnSetVisibleUpdatePanel3 click event in the code behind:

updatepanel3.visible = true/false;

updatepanel1.update( ); // if that missing only updatepanel2 will be updated during the partial postback.

Panel Default Button Event Doesnt Fire On Second Submit

I have one UpdatePanel surrounding a asp panel. Inside the panel I have one repeater, two buttons, and two labels. Inside the repeater's ItemTemplate I have an ImageButton and TextBox.

Here is the ASP Code:

1<asp:UpdatePanel ID="AdvancedSearchUpdatePanel" runat="server" UpdateMode="conditional" RenderMode="block" ChildrenAsTriggers="true">2 <ContentTemplate>3 <asp:Panel ID="AdvancedSearchPanel" runat="server" DefaultButton="SubmitSearchButton">4 <asp:Repeater ID="AdvancedSearchRepeater" runat="server">5 <HeaderTemplate>6 <table class="searchButton">7 <tr>8 <td colspan="100%">9 <asp:Label ID="KeywordLabel" runat="server" Text="Search By Keyword" Width="100%" Font-Bold="true"/>10 </td>11 </tr>12 </HeaderTemplate>13 <ItemTemplate>14 <tr>15 <td colspan="100%">16 <table cellpadding="0" cellspacing="0" style="padding-right:5px">17 <tr>18 <td>20 <asp:ImageButton ID="DeleteCriteriaButton" runat="server" ImageUrl="~/Resources/Images/close.gif" AlternateText="Click to Delete" OnClick="DeleteCriteriaButton_Click" />21 </td>22 <td>23 <asp:TextBox ID="KeywordTextBox" runat="server" Text='<%# Container.DataItem%>' CssClass="keywordSearch" Width="123px" OnTextChanged="KeywordTextBox_TextChanged" />24 </td>25 </tr>26 </table>27 </td>28 </tr>29 </ItemTemplate>30 <FooterTemplate>31 </table>32 </FooterTemplate>33 </asp:Repeater>34 <table class="searchButton">35 <tr>36 <td>37 <asp:Button ID="AddAnotherSearchButton" Text="Add Criteria" runat="server" OnClick="AddAnotherSearchButton_Click" />38 </td>39 <td>40 <asp:Button ID="SubmitSearchButton" Text="Submit Search" runat="server" OnClick="SubmitSearchButton_Click" />41 </td>42 </tr>43 <tr>44 <td colspan="100">45 <asp:Label ID="ReadableSqlString" runat="server" />46 </td>47 </tr>48 <tr>49 <td colspan="100">50 <asp:Label ID="ErrorLabel" runat="server" ForeColor="red"/>51 </td>52 </tr>53 </table>54 </asp:Panel>55 </ContentTemplate>56</asp:UpdatePanel>

My problem is that the default button for the panel is the SubmitSearchButton. 
On the first press of the enter key everything works as it should. 
On the second press of the enter key the DeleteCriteriaButton's (ImageButton) event gets fired because it is the first button in the panel. 
The only way I have seen to get around this is to put a button before the ImageButton that has a width of zero and have its event call the SubmitSearchButton event and everything works as should. 
Does anyone know a cleaner way around this problem or a reason this is happening. 
 
Thanks in advance.

There is a free component that allows you to assign a button to the "enter-pressed" client side event of input controls. If you type some text in textbox and press Enter, the form will postback, and the serverside click event of your button is fired.You don't need to write any code You only need to use control's "DefaultButton" property. It you are a beginner programmer this could be a life saver. More about MetaBuilders DefaultButtons Control you can find athttp://www.metabuilders.com/Tools/DefaultButtons.aspx
Wish this can help you.
You can specify a default button through javascript when pressing enter key.Try to take a look at this reading for details -http://www.beansoftware.com/ASP.NET-Tutorials/Accept-Enter-Key.aspx
Here are some sample codes for your reference.
TextBox1.Attributes.Add("onkeydown", "if(event.which || event.keyCode){if ((event.which == 13) || (event.keyCode == 13)) {document.getElementById('"+Button1.UniqueID+"').click();return false;}} else {return true}; ");
Wish the above can help you.

DefaultButton is working fine for me on a simpler example:

<%@. Page Language="C#" AutoEventWireup="true" EnableEventValidation="false" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected void click(object sender, EventArgs e) { label1.Text = string.Format("{0} pressed at {1}", ((Control)sender).ID, DateTime.Now.ToString()); }</script><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <asp:UpdatePanel ID="up1" runat="server"> <ContentTemplate> <asp:Panel ID="panel1" runat="server" DefaultButton="button2"> <asp:TextBox ID="text1" runat="server" /> <asp:Button ID="button1" runat="server" OnClick="click" Text="one" /> <asp:Button ID="button2" runat="server" OnClick="click" Text="two" /> </asp:Panel> <asp:Label ID="label1" runat="server" /> </ContentTemplate> </asp:UpdatePanel> </form></body></html>

This does what you'd expect... every time you type something and press enter, the label displays "button2 pressed at " followed by the current time.

Your sample is considerably more complicated (and hard to reproduce, since I would need to provide a datasource etc.). Could you try simplifying your code to see at what point the issue goes away?

You can't forget that in my code I have repeaters. This might be the problem. My quick fix is to put a button before the delete button and set it to call the submit button's click event. I know this is a hack and I'm working on other issues. Your help is greatly appreciated. FYI, the datasource of the repeater is a List<string>.
I tested your code with a asp:Panel(asp:Repeater) in a asp:UpdatePanel in my PC.My test enviroment isWindows Server 2003 Enterprise,VS.NET 2005 and Ajax RC1.0. I found it?could?work?fine.If?you?click?the?TextBox?and?press?Enter?key in theasp:Panel, the?default?button?of?the?asp:Panel will?be?triggered.If?the?current?focus?was?moved to?the?outside?of?the?asp:Panel?and?press?Enter?key, the?default?button?of?the?asp:Panel?can't?be?triggered.So if you want to pressEnter key in anywhere of the current web form and the default button of theasp:Panel will be triggered, try to focus on aTextBox of theasp:Panel throughjavascript when pressingEnter key in the web form.This should work fine for you.
Sample Code: document.forms[0].elements['txtBox'].focus();
Wish this can help you.
This works in Internet Explorer 7, but not in Fire Fox 2. I'm soooo surprised.

Panel Extenders

I am having a custom UI control. I want to extend the UI control with 2 extenders

1. Drag Panel Extender

2. Resizable Extender

I am using DragPanelExtender & Resizable Extender classes and adding them to the control collection of the custom UI control duly settnig all targets etc., but I am not really happy doing that.

Can anybody please suggest how can I (re)build my control integrating DragPanelExtender & ReziablePanel extender. What is the best practice to have similary functionality for custom UI controls.

Hi,

In my opinion, to add extenders dynamically as you've already done is a good approach to encapsulate extenders in a customControl.

Panel in div with rounded corners grows beyond div height when using RoundedCorners

I had originally posted this in the Atlas forum by mistake. Sorry for the double post.

I am just learning CSS so forgive me if this is something simple but I have a div that has a height of 50px. If I add a panel to that div and set it's height to 100% without the rounded corner extender it fills the div as you would expect. When I add the rounded corner extender to the panel it grows to 142px. If I remove the RoundedCornerExtender it displays correctly.

Any idea what is causing this?

Here is some sample code:

<

headrunat="server"><title>Panel expanding beyond div height.</title>

</

head>

<

atlas:ScriptManagerID="ScriptManager1"runat="server">

</

atlas:ScriptManager>

<

body><formid="form1"runat="server"><divid="Wrapper"style="vertical-align: top; width: 750px;"><divid="Header"style="vertical-align: top; background-color: White; padding: 4px;

height: 50px; width: 100%;">

<asp:PanelID="pnlHeader"runat="server"BackColor="Blue"ForeColor="White"Height="100%"HorizontalAlign="Center"Width="100%">This should only be 50px high.</asp:Panel></div><divid="Content"></div><divid="Footer"></div></div></form>

<cc1:RoundedCornersExtenderID="RoundedCornersExtender1"runat="server">

<cc1:RoundedCornersPropertiesTargetControlID="pnlHeader"Color="Blue"Radius="7"/>

</cc1:RoundedCornersExtender>

</

body>It's the Height="100%" on pnlHeader that's confusing things. If you can change that to Height="50", the results seem to be what you want.

Thanks for the thought. But wouldn't the height setting on the Header limit it to 50px? I have found a workaround by creating a cssClass for the panel and setting the height there and not using the Height=100% within the control.

My original use of the 100% within the control was working until the July CTP. Again thanks for the assistance. Something must have changed in the July CTP that caused this to happen.

Panel inside an absolute positioned div tag and DropShadowExtender.

I have a Panel inside an absolutly positioned DIV tag. The drop shadowextenders targed control is the Panel. The DropShadow dosn't render properly. It seems to render double the distance of the div from the top and the left side. I am using the Atlas July CTP and the toolkitRelease 60731.

In the example below the div is set to 100px from the left of the page. The DropShadow is then rendered 200px from the left. When I position the div in normal flow it works correctly but this dosn't suit my needs.

Can anyone tell me how to fix this behavoir.

Thanks in advance

David O'Shea

<atlas:ScriptManagerID="ScriptManager1"runat="server"/>

<divstyle="z-index: 101; left: 100px; width: 250px; position: absolute; top: 100px;

height: 228px">

<asp:PanelID="Panel1"runat="server"BackColor="Blue"Height="200px"Width="200px"></asp:Panel></div><cc1:DropShadowExtenderID="DropShadowExtender1"runat="server"><cc1:DropShadowPropertiesOpacity=".8"Rounded="true"TargetControlID="Panel1"TrackPosition="True"/></cc1:DropShadowExtender>

I removed the div tag and set the style of Panel1 to absolute position and it works fine.

Rgds

David O'Shea

Panel is resizing when it is used with RoundCornerExtender.It looks page load twice

hi

I have a master page , in that i have placed three panels and foreach panel i have a RoundedCornersExtender for round corners.problem iswhen i run the page it loads two times. I think that is because of roundcornerextender,when the page loads the panel looks to be resizing and it causes the page loads twice

when i remove the RoundedCornersExtender from the panel,it worksfine and load only once.but i want round corner panel for my masterpage to look good.

if anybody having the solution for this,plz advice me.Thanks in advance

This is my master page code

<%@dotnet.itags.org. Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<%@dotnet.itags.org. Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<link href="http://links.10026.com/?link=Hq_StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body bgcolor="#4B5C82"><%--"#4B5C82"--%>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

<table cellspacing="5" cellpadding="4" width="95%" align="center" id="mastertable">
<tr>
<td colspan="2">
<asp:Panel ID="panel1" runat="server" Width="100%" BackColor="#ffffff" >
<!--#include file="header.aspx"-->
</asp:Panel>

</td>
</tr>
<tr >
<td width="20%" height="100%" valign="top" >
<asp:Panel ID="panel2" runat="server" Width="100%" BackColor="#ffffff" Height="100%">
<table cellpadding="3"><tr><td>
<!--#include file="leftnav.aspx"-->
</td></tr>
</table>
</asp:Panel>
</td>
<td width="80%">
<asp:Panel ID="panel3" runat="server" Width="100%" BackColor="#ffffff" Height="100%">
<table cellpadding="3"><tr><td>
<asp:contentplaceholder id="middleContent" runat="Server"></asp:contentplaceholder>
//Content pages
</td></tr>
</table>
</asp:Panel>
</td>

</tr>
<tr>
<td></td>
<td id ="footer">
<!--#include file="footer.aspx"-->
</td>
</tr>
</table>
<ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtender1"runat="server" TargetControlID="Panel1" Radius="8"BorderColor="#ffffff">
</ajaxToolkit:RoundedCornersExtender>
<ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtender2"runat="server" TargetControlID="Panel2" Radius="8"BorderColor="#ffffff">
</ajaxToolkit:RoundedCornersExtender>
<ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtender3"runat="server" TargetControlID="Panel3" Radius="8"BorderColor="#ffffff">
</ajaxToolkit:RoundedCornersExtender>
</form>
</body>
</html>

Regards

Ajith

Hi Ajith,

My suggestion is you can wrap all contents in an div, and set this div's display property to "none" initially.

Then, add a pageLoad function to show it on client side. Like this:

function pageLoad()
{
$get("div's id").style.display = "block";
}

Hope this helps.

Hi Wen

Thank you Very much. it is working superb, but sometime when page loads, twice loading happens again(some times only).what would be the problem?

plz advice.Thank you very much once again

Regards

Ajith

It's hard to tell because I'm not able to reproduce that.

Can you make sure which element incurs a second postback?

Hi Wen

in my header page , i have menu for each page.for eg consider first menu
having a link to 1st page, in that page i having several textboxes and 1 dropdownlist
and cascadingdropdown and 1 auto complete extender.in that menu i clicked several times
only one time the page load twice.i think it may coz of processing time.

2nd having link to another page, in that page also i am having the same controls mentioned above and aditionally i am having ultrawebgrid(thirdpartycontrol,infragistics).i click
this menu also several time , in this case the pages seems like loading
twice so many times. idont know which control is making the problem.

This is the situation i am having.

Plz advice.

Regards

Ajith

panel master page height 100%

why does a panel's height=100% not span the whole page on when you put it on the master page? I think it works when you don't have a ajaxscriptmanager, but when you add that it doesn't span the whole page... anyone know why?

Try changing your doc type to:

<!

DOCTYPEHTMLPUBLIC"-//W3C//DTD HTML 4.01 Transitional//EN">

GJ

It doesn't have anything to do with AJAX cause it never worked for me :)

I tried changing DOCTYPE fromXHTML 1.0to HTML 4.01still doesn't work..

By the way what would be differences when we change DOCTYPE??

Thanks..

I don't know about the panel's height property specifically, as I do all my styling via CSS, but I will tell you that when using CSS, you have to set the parent container heights to 100% as well for it to work as expected. Parent containers will be, minimally, HTML, BODY, and FORM (that last one only necessary for IE, iirc).