Wednesday, March 28, 2012

Multiple PopupControlExtender - HOW?

Hi!

For example I have 10 textbox on my page. I created a panel with a calendar inside. I use 10 PopupControlExtender to bound the same panel to every textbox. (i dont want to create 10 diffrent Panels!)

And now i have a problem: How can i found out which PopupcontrolExtener and/or Textbox opend the calendar? I need this to set the value.

Any idea?

Thank you and sorry for bad english ;-)

Make it a user control. I've already done this and other than the issues that I've noted in some other posts about the popup behavior no longer working after postback, it works just fine. Below is the code I use to create the UserControl.

<%@. Control Language="C#" AutoEventWireup="true" CodeFile="DatePicker.ascx.cs" Inherits="User_Controls_DatePicker" %>
<asp:TextBox ID="tbDateSelected" runat="server" SkinID="DateTextBox"></asp:TextBox>
<asp:Panel ID="Panel1" runat="server" CssClass="popupControl">
<aspAjax:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<center>
<asp:Calendar ID="Calendar1" runat="server" BackColor="White" BorderColor="#999999"
CellPadding="1" DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt"
ForeColor="Black" Width="160px" OnSelectionChanged="Calendar1_SelectionChanged">
<SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />
<TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />
<SelectorStyle BackColor="#CCCCCC" />
<WeekendDayStyle BackColor="#FFFFCC" />
<OtherMonthDayStyle ForeColor="#808080" />
<NextPrevStyle VerticalAlign="Bottom" />
<DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />
<TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" />
</asp:Calendar>
<asp:ImageButton ID="imgCancel" runat="server" ImageUrl="../images/close.gif" OnClick="imgCancel_Click" />
</center>
</ContentTemplate>
</aspAjax:UpdatePanel>
</asp:Panel>
<ajaxToolkit:PopupControlExtender ID="pceDate" runat="server" PopupControlID="Panel1" TargetControlID="tbDateSelected" Position="Bottom" ></ajaxToolkit:PopupControlExtender>
<ajaxToolkit:DropShadowExtender ID="DropShadowExtender1" runat="server" TargetControlID="Panel1" Radius="6" Opacity="1" TrackPosition="true" Width="5">
</ajaxToolkit:DropShadowExtender
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using AjaxControlToolkit;

public partial class User_Controls_DatePicker : System.Web.UI.UserControl
{
private string _selectedDate;

public string SelectedDate
{
get { return tbDateSelected.Text; }
set { tbDateSelected.Text = value; }
}

public string Position
{
set { pceDate.Position = ( PopupControlPopupPosition ) Enum.Parse( typeof( PopupControlPopupPosition ), value ); }
}

protected void Page_Load( object sender, EventArgs e )
{
}

protected void Calendar1_SelectionChanged( object sender, EventArgs e )
{
pceDate.Commit( Calendar1.SelectedDate.ToShortDateString( ) );
}
protected void imgCancel_Click( object sender, ImageClickEventArgs e )
{
pceDate.Cancel( );
}
}

Hope this helps.

Nick


You can find out which PopupControlExtender called the calendar with the info accessible by calling this following function, in the event handler for the control you popped up:

 
AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page)
You can use that in, say, your calendar's OnSelectedDateChanged event handler to see where it needs to go.

You can use the .Commit() function to submit the information from the calendar to the correct control. Once again, this would go in the event handler for your calendar's OnSelectedDateChanged event handler.

AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page).Commit(Calendar1.SelectedDate.toString())
 
Thanks toTed Glaza for the assist. 

Hello!

Thanks for your reply!

@.ncipollina
Thats not the right solution. I dont want to deliver 10 rendered controls (With the same content!) to the client. Thats to much overhead!

@.Matt M
Hi! That sounds interessting. But I dont get the point.

Protected Sub Calender_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs)
Dim currentPopupControlExtender as AjaxControlToolkit.PopupControlExtender = AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page)
currentPopupControlExtender.Commit(DirectCast(sender, Calendar).SelectedDate)
End Sub

Is this what you mean? I will try it tomorrow!


Undying:

Hello!

Thanks for your reply!

@.ncipollina
Thats not the right solution. I dont want to deliver 10 rendered controls (With the same content!) to the client. Thats to much overhead!

@.Matt M
Hi! That sounds interessting. But I dont get the point.

Protected Sub Calender_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs)
Dim currentPopupControlExtender as AjaxControlToolkit.PopupControlExtender = AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page)
currentPopupControlExtender.Commit(DirectCast(sender, Calendar).SelectedDate)
End Sub

Is this what you mean? I will try it tomorrow!

Use

AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page).TargetControlID
to find the TargetControlID of the PopupControlExtender that caused the panel to pop up. In other words, what textbox is the target of the PopupControlExtender.
 
Is that what you are looking for? 

Matt you are the man!

Protected

Sub Calender_SelectionChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)

AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(

Me).Commit(DirectCast(sender, Calendar).SelectedDate)EndSub

This work like a charme! I could use the Same "DatePickerPanel" on my page many times without duplicate code. Just add a Extender to the textbox and I'm done! Fine!

Thanks again for sharing this!


I am not sure that this actually works. I mean, the commit on the proxy works, but if I try to retrieve the value of TargetControlID from AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page).TargetControlID, it is null (which sense since what is returned from the getproxy method is an empty popupcontrolextender)

Is there any way to retrieve this information? I am trying to set the value of two textboxes, each based on the other and another arbittrary value...

i.e. - i would like my code to be soomething like:

AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page).Commit(calendar1.selecteddate.tostring())

select case AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page).TargetControlID

case "text1"

text2.text=format(calendar1.selecteddate.addmonths(arbitrary value),"MM/dd/yyyy")

case "text2"

text1.text=format(calendar1.selecteddate.addmonths(-1*arbitrary value),"MM/dd/yyyy")

end select


Could you pleaseopen a work item to report and track this issue. Thank you!

Multiple Popup Controls in PopupControlExtender

This is the code i have.

<atlasToolkit:PopupControlExtenderID="PopupControlExtender1"runat="server">

<atlasToolkit:PopupControlPropertiesPopupControlID="Panel1"Position="Bottom"TargetControlID="txtFrom"/>

<atlasToolkit:PopupControlPropertiesPopupControlID="Panel1"Position="bottom"TargetControlID="txtTo">

</atlasToolkit:PopupControlProperties>

</atlasToolkit:PopupControlExtender>

I get the following error message. But, if i remove one of the popupcontrols it works fine. AtlasControlToolkit version is 1.0.60914.0. What am i doing wrong.

Couldn't get extender properties on extender PopupControlExtender1. Make sure the ID is spelled correctly and the control is on the page.

Please include the complete error information and post a complete, simple sample page if you could.

Multiple Popups using popcontrol extender

In the previous version of the ajax control toolkit I could reference multiply popups with one control. Ie on the page I have one calendar and 10 different textboxs which call popup the same calendar control. This would then run the selection changed code for the calendar and commit the date to which ever control had opened the popup. ie

ProtectedSub Date_Selector_SelectionChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles Date_Selector.SelectionChanged

Date_Popup.Commit(Date_Selector.SelectedDate.ToShortDateString)

EndSub

However with the new version of the toolkit you have to have a different popup for each textbox. So when it goes into the date selector section how do I chosse the right popup to send the data back to.

I think the test case in ToolkitTests\Manual\Repeater.aspx shows how to do this the new way.

I had asimilar problemTed Glaza helped me solve. I have two textboxes with a popupcontrolextender attached to each, both of which call a single calendar, cal1. Some code snippits:

Code behind:

Protected Sub Cal1_SelectionChanged(ByVal senderAs Object,ByVal eAs System.EventArgs)Handles Cal1.SelectionChangedDim tmppceAs AjaxControlToolkit.PopupControlExtender tmppce = AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page) tmppce.Commit(Cal1.SelectedDate)End Sub

Declaration on the top of the .aspx page:

<%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="act" %>
 
Everything works as expected. One thing to note, I'm running a self-compiled version of the toolkit - 9854. 

Multiple Postbacks for AJAX

OK...I'm trying to think of the best solution for this situation:

I have an asp.net AJAX enabled website where the user can run complex queries off my SQL Server database. Some of these queries can last quite a few minutes to complete. What I want to happen is when the user clicks a button to run the query, the user can still move around the website while the query is running. And when the query is done, it basically alerts the user it is finished (by updating a label on the site, for example). So, I tried to do this in AJAX, but the problem is (as far as I understand it) is that, by default, the last postback takes precedence, so that if the user clicked another button after he clicked the run query button, the query can not post back to the site saying the query is done.

So I have a couple of questions:

1) Is there anyway for the site to respond asynchronsly to multiple postbacks?

2) If I make multiple postbacks, will all the calls still finish processing? Is it only that it can't post anything back to the server? For example, if the user ran a query that inserted rows into a table, and he clicked somewhere on the page, will the first postback still finish to completion?

3) Would any sort of multi-threading work in my example?

Thanks for any responses!!

-Howie

hello.

well, yes, you can, for instance, make several web service calls. you cannot do the same thing with an UpdatePanel since the last postback will, by default, cancel the previous one. what i think you should do is built some sort of queuing for packaging the client queries and sending them to the server. and i also think that you should use web services instead of updatepanels :)


Hi, thanks for the response. When you say that the last postback will cancel the previous ones, do you mean that it will cancel the query midway through? (excuse me if I'm being naive). Or do you mean that my code will still execute OK (that if the user wanted to insert rows into the table, that it will still do so without interruption), but I just can't post back a result to the site? Also, what do you mean I can make several web service calls? Would you be able to point me to a site I can read up more about it? (I know what web services are...I just don't know exaxtly what you'te referring to).

I really appreciate your help.

Multiple rating controls on one page malfunction

Hi,

When I put multiple rating controls on a page, only the first one works. The others act as if they has set ReadOnly = true. I've tried putting them on different pages, inside different update panels, inside the same update panel, outside update panels, setting ReadOnly = false for each one, setting the same OnChanged function, setting different OnChanged functions. Same thing every time. The first one works just fine and calls its OnChanged function. All the rest don't respond to mouseOver, and don't call their OnChanged. But their 1-5 tooltips do pop up, so they are breathing. Please help!

Any thoughts? Am I the only one this happens to? I'm new to ajax, so please point out the obvious...

I have the Script Manager on a master page. I set the .css to the one given in AjaxControlToolkit\SampleWebSite for simplicity. I also tacked ajax onto this project by copying web.config info ala joe's video- did I maybe miss something there?

Here's the code-

<asp:UpdatePanel id="upFilter1" runat="server">
<contenttemplate>
<cc1:Rating ID="rateFilter1" runat="server"
BehaviorID="RatingBehavior1"
CurrentRating="2"
MaxRating="5"
StarCssClass="ratingStar"
WaitingStarCssClass="savedRatingStar"
FilledStarCssClass="filledRatingStar"
EmptyStarCssClass="emptyRatingStar"
OnChanged="ContentFilterChanged"
style="float: left;" Height="6px" Width="65px" />
</contenttemplate>
</asp:UpdatePanel
<asp:UpdatePanel id="upFilter2" runat="server">
<contenttemplate>
<cc1:Rating ID="rateFilter2" runat="server"
BehaviorID="RatingBehavior1"
CurrentRating="2"
MaxRating="5"
StarCssClass="ratingStar"
WaitingStarCssClass="savedRatingStar"
FilledStarCssClass="filledRatingStar"
EmptyStarCssClass="emptyRatingStar"
OnChanged="ContentFilterChanged1"
style="float: left;" Height="6px" Width="65px" ReadOnly=false />
</contenttemplate>
</asp:UpdatePanel>


Again, first one works fine, second one doesn't respond.


I think it's because your BehaviorID IDs are the same. I'm having the same problem, but I'm generating my Ratings in a while loop, so cannot change them.


Anyone got any idea how I give each Rating control a unique BehaviorID?


Yep, that did it. It works with the basic appearances- now to hook them up to actually function. If it changes the functionality I'll check back in.

What's wrong with the loop? Can't you just set

NextRating.BehaviorID = NextID

NextID += 1



I've since found that you don't use while loops to output multiple rows of returned data anymore. The new method is to use an ASP Repeater and bind it to a dataTable. This magically sorts the IDs out for you by itself.

multiple ScriptManagers on a page

hi there; i've created the following page:

<%@dotnet.itags.org.PageLanguage="VB"MaintainScrollPositionOnPostback="true"AutoEventWireup="true"EnableEventValidation="false" %>

<!DOCTYPEHTMLPUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN"> <htmlxmlns="http://www.w3.org/1999/xhtml">

<headid="Head1"runat="server">

<title>Welcome</title>

<scriptlanguage="VB"runat="server">

ProtectedSub RedirectUser(ByVal senderAs System.Object,ByVal eAs System.EventArgs)

Dim tempID = ddlTemp.SelectedItem.Value

Response.Redirect("default.aspx?tempID=" & tempID)

EndSub

</script>

</head>

<body>

<formid="frm"defaultfocus="txtTemp"runat="server">

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

<divclass="index"> <center>

<tablewidth="100%"height="100%"border="0"cellpadding="0"cellspacing="0">

<tr>

<td>

<divstyle="width:615px; text-align:left;">

<atlasToolkit:CascadingDropDownID="CascadingDropDown1"runat="server">

<atlasToolkit:CascadingDropDownPropertiesLoadingText="Loading"Category="B"TargetControlID="ddlB"

ServiceMethod="GetB"ServicePath="WebService.asmx"PromptText="Please select"/>

<atlasToolkit:CascadingDropDownPropertiesCategory="A"TargetControlID="ddlA"

ParentControlID="ddlB"LoadingText="Loading"ServiceMethod="GetA"ServicePath="WebService.asmx"

PromptText="Please select"/>

</atlasToolkit:CascadingDropDown>

<asp:DropDownListID="ddlB"runat="server"/>

<asp:DropDownListID="ddlA"AutoPostBack="true"OnSelectedIndexChanged="RedirectUser"runat="server"/>

<divstyle="margin-top:25px;">

<asp:TextBoxID="txtTemp"runat="server"></asp:TextBox>

<asp:ButtonID="cmdFindTemp"CssClass="submit"UseSubmitBehavior="false"OnClientClick="this.disabled = true; this.value = 'Submitting...';"runat="server"PostBackUrl="default.aspx"Text="Go!"/>

<atlas:AutoCompleteExtenderID="AutoCompleteExtender1"runat="server">

<atlas:AutoCompletePropertiesServicePath="WebService.asmx"ServiceMethod="GetTemp"TargetControlID="txtTemp"Enabled="true"MinimumPrefixLength="1"/></atlas:AutoCompleteExtender>

</div>

</div>

</td>

</tr>

</table>

</center>

</div>

</form> </body>

</html>

this page basically displays a couple of dropdown lists, a textbox and a submit button.

as you can see, i'm using the atlas control and the atlas toolkit control.

to make the controls function, i'm using the atlas:Scriptmanager.

using asp:scriptmanager (instead of an atlas:Scriptmanager) causes my page to crash with the following error message:

Extender controls require a ScriptManager to be present on the page.
Parameter name: scriptManager

what's worse is that if i try to add an ajaxToolkit control, such as:

<ajaxToolkit:TextBoxWatermarkExtenderID="TextBoxWatermarkExtender1"runat="server"TargetControlID="txtTemp"WatermarkText="Type Name Here"WatermarkCssClass="watermarked"></ajaxToolkit:TextBoxWatermarkExtender>

then i get the following error:

The control with ID 'TextBoxWatermarkExtender1' requires a ScriptManager on the page. The ScriptManager must appear before any controls that need it.

well, the atlas:ScriptManager is before it and, again, i still get an error if i try using the asp:ScriptManager.

my question is, how many different scriptmanager's are there and what can i use that cover's all controls (i.e. ajax, ajaxToolbarKit, atlasToolbarKit)

thanks all.

Hi Chubbs,

Your problem is caused by the confilict between Atlas(previous version of Asp.Net Ajax Extension) and Asp.Net Ajax Extension. Ajax ControlToolkit works depend on Asp.Net Ajax Extension 1.0. So why not convert your application from "Atals" to "Asp.Net AJAX RTM" since it is more powerful and stable. It is recommended to update your Asp.Net Ajax Extension and Ajax ControlToolkit to the latest version.

Here is the way: http://ajax.asp.net/documentation/Migration_Guide_CTP_to_RTM.aspx

By can download the lastest released version here:http://ajax.asp.net/downloads/default.aspx?tabid=47

Hope it helps.


hi, jonathan; thanks for the response.

well, it took me several hours to tweak and work out the ensuing glitches, but it finally paid off. much cleaner now.

anyway, for the benefit of those who have the same issue, i will post my final working code.

basically, i have 2 cascading dropdowns that each receive their data from a database.

DROPDOWN.ASPX

======================================

<%@.PageLanguage="VB"MaintainScrollPositionOnPostback="true"AutoEventWireup="true"EnableEventValidation="false" %>

<!DOCTYPEHTMLPUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headid="Head1"runat="server">

<title>Cascading Drop Down</title>

<scriptlanguage="VB"runat="server">

</script>

<linkhref="styles.css"rel="stylesheet"type="text/css"/>

</head>

<bodyclass="index">

<formid="frmIndex"defaultfocus="txtCompany"runat="server">

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

<divid="index">

<center>

<tablewidth="100%"height="100%"border="0"cellpadding="0"cellspacing="0">

<tr>

<td>

<divstyle="width:630px; text-align:right;">

<ajaxToolkit:CascadingDropDown

LoadingText="Loading Provinces"

Category="Province"

ID="CascadingDropDown1"

TargetControlID="ddlProvince"

ServiceMethod="GetProvinces"

ServicePath="WebService.asmx"

PromptText="Please select a province"

runat="server"/>

<ajaxToolkit:CascadingDropDown

LoadingText="Loading Cities"

ParentControlID="ddlProvince"

Category="City"

ID="CascadingDropDown2"

TargetControlID="ddlCity"

ServiceMethod="GetCities"

ServicePath="WebService.asmx"

PromptText="Please select a city"

runat="server"/>

<asp:DropDownListID="ddlProvince"runat="server"/>

<asp:DropDownListID="ddlCity"AutoPostBack="true"OnSelectedIndexChanged="RedirectUser"runat="server"/>

</div>

</td></tr>

</table>

</center>

</div>

</form>

</body>

</html>

WEBSERVICE.VB

======================================

Imports System.Web

Imports System.Web.Services

Imports System.Web.Services.Protocols

Imports System.Collections.Generic

Imports AjaxControlToolkit

Imports System.Data

Imports System.Data.SqlClient

Imports System.Collections

Imports System.Collections.Specialized<WebService(Namespace:="http://tempuri.org")> _

<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _

<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _

<System.Web.Script.Services.ScriptService()> _

PublicClass WebServiceInherits System.Web.Services.WebService

<WebMethod()> _

PublicFunction GetProvinces(ByVal knownCategoryValuesAsString,ByVal categoryAsString)As AjaxControlToolkit.CascadingDropDownNameValue()

Dim valuesAsNew System.Collections.Generic.List(Of AjaxControlToolkit.CascadingDropDownNameValue)

Dim myDatasetAs DataSet

myDataset = HttpContext.Current.Cache("tblProvince")

If myDatasetIsNothingThen

Dim myConnectionAsNew SqlConnection(ConfigurationManager.ConnectionStrings("myConnectionString").ConnectionString)

Dim myCommandAsNew SqlCommand("SELECT * FROM tblProvince", myConnection)

Dim myAdapterAsNew SqlDataAdapter(myCommand)

myDataset =New DataSet

myAdapter.Fill(myDataset)

HttpContext.Current.Cache.Insert("tblProvince", myDataset)

Else

myDataset =CType(HttpContext.Current.Cache("tblProvince"), DataSet)

EndIf

ForEach rowAs DataRowIn myDataset.Tables(0).Rows

values.Add(New CascadingDropDownNameValue(row("fldProvince"), row("fldProvinceID")))

Next

Return values.ToArray

EndFunction

<WebMethod()> _

PublicFunction GetCities(ByVal knownCategoryValuesAsString,ByVal categoryAsString)As CascadingDropDownNameValue()

Dim kvAs StringDictionary = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues)

IfNot (kv.ContainsKey("Province"))Then

ReturnNothing

EndIf

Dim valuesAsNew System.Collections.Generic.List(Of AjaxControlToolkit.CascadingDropDownNameValue)

Dim myConnectionAsNew SqlConnection(ConfigurationManager.ConnectionStrings("myConnectionString").ConnectionString)

Dim strSQLAsString ="SELECT * FROM tblCity WHERE (tblCity.fldProvinceID='" & kv("Province") &"')"

Dim myCommandAsNew SqlCommand(strSQL, myConnection)

Dim myAdapterAsNew SqlDataAdapter(myCommand)

Dim myDatasetAsNew DataSet

myAdapter.Fill(myDataset)

ForEach rowAs DataRowIn myDataset.Tables(0).Rows

values.Add(New CascadingDropDownNameValue(row("fldCity"), row("fldCityID")))

Next

Return values.ToArrayEndFunction

EndClass

WEB.CONFIG

======================================

<?xmlversion="1.0"?>

<configuration>

<configSections>

<sectionGroupname="system.web.extensions"type="System.Web.Configuration.SystemWebExtensionsSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">

<sectionGroupname="scripting"type="System.Web.Configuration.ScriptingSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">

<sectionname="scriptResourceHandler"type="System.Web.Configuration.ScriptingScriptResourceHandlerSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"requirePermission="false"allowDefinition="MachineToApplication"/>

<sectionGroupname="webServices"type="System.Web.Configuration.ScriptingWebServicesSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">

<sectionname="jsonSerialization"type="System.Web.Configuration.ScriptingJsonSerializationSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"requirePermission="false"allowDefinition="Everywhere" />

<sectionname="profileService"type="System.Web.Configuration.ScriptingProfileServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"requirePermission="false"allowDefinition="MachineToApplication" />

<sectionname="authenticationService"type="System.Web.Configuration.ScriptingAuthenticationServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"requirePermission="false"allowDefinition="MachineToApplication" />

</sectionGroup>

</sectionGroup>

</sectionGroup>

</configSections>

<connectionStrings>

<addname="myConnectionString"connectionString="Data Source={SQLServer};Server=yourServer;Database=yourDatabase;Uid=yourID;Pwd=yourPassword;"/>

</connectionStrings>

<system.web>

<pages>

<controls>

<addnamespace="System.Web.UI"tagPrefix="asp"assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

<addnamespace="AjaxControlToolkit"assembly="AjaxControlToolkit"tagPrefix="ajaxToolkit"/>

<addnamespace="AtlasControlToolkit"assembly="AtlasControlToolkit"tagPrefix="atlasToolkit"/>

<addnamespace="System.Data"tagPrefix="asp"/>

<addnamespace="System.Data.SQLClient"tagPrefix="asp"/>

</controls></pages>

<compilationdebug="true">

<buildProviders>

<addextension=".asbx"type="Microsoft.Web.Services.BridgeBuildProvider"/>

</buildProviders>

<assemblies>

<addassembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

<addassembly="System.Design, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>

<addassembly="System.Web.Extensions.Design, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>

<addassembly="System.Windows.Forms, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>

</assemblies>

</compilation>

<httpHandlers>

<removeverb="*"path="*.asmx"/>

<addverb="*"path="*.asmx"validate="false"type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

<addverb="*"path="*_AppService.axd"validate="false"type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

<addverb="GET,HEAD"path="ScriptResource.axd"type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"validate="false"/></httpHandlers>

<customErrorsmode="Off"/>

<httpModules>

<addname="ScriptModule"type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

</httpModules>

</system.web>

<system.web.extensions>

<scripting>

<webServices>

<!-- Uncomment this line to customize maxJsonLength and add a custom converter-->

<!--

<jsonSerialization maxJsonLength="500">

<converters>

<add name="ConvertMe" type="Acme.SubAcme.ConvertMeTypeConverter"/>

</converters>

</jsonSerialization>

-->

<!-- Uncomment this line to enable the authentication service. Include requireSSL="true" if appropriate.-->

<!--

<authenticationService enabled="true" requireSSL = "true|false"/>

--><!-- Uncomment these lines to enable the profile service. To allow profile properties to be retrieved

and modified in ASP.NET AJAX applications, you need to add each property name to the readAccessProperties and

writeAccessProperties attributes.-->

<!--

<profileService enabled="true"

readAccessProperties="propertyname1,propertyname2"

writeAccessProperties="propertyname1,propertyname2" />

-->

</webServices>

</scripting></system.web.extensions>

<system.webServer>

<validationvalidateIntegratedModeConfiguration="false"/>

<modules>

<addname="ScriptModule"preCondition="integratedMode"type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

</modules>

<handlers>

<removename="WebServiceHandlerFactory-ISAPI-2.0"/>

<addname="ScriptHandlerFactory"verb="*"path="*.asmx"preCondition="integratedMode"type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

<addname="ScriptHandlerFactoryAppServices"verb="*"path="*_AppService.axd"preCondition="integratedMode"type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

<addname="ScriptResource"preCondition="integratedMode"verb="GET,HEAD"path="ScriptResource.axd"type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />

</handlers>

</system.webServer>

</configuration>

Well, there it is in it's entirety. Hopefully this will help someone get up and running with this control in the future.

Good luck!

Multiple Simulatenous Triggering Events

Hello,

I have a scenario where I would like to programmaticallyclickmultiplebuttons that are triggering events of UpdatePanels by calling the JavaScript click method on the button. I would then like any of the UpdatePanel's that use the buttons' click event as their trigger to Update.

I'm running into what seems to be a race condition or asychronous problem with executing the click event. After I programmatically click the first button, the UpdatePanel associated with it begins to refresh, but when I programmatically click the second button, the Atlas framework seems to ignore the second click event.

Does anybody have any ideas on how to do something like this where you can progammatically cause multiple triggers to fire in parallel by executing JavaScript on the client side?

Thx, Joelyou may have a cache problem here, did you try to clear it/set it to expire?

Multiple simultaneous (Cascading) Modalpopups

Can I open two (or more) modalpopups simultaneous?

Can I open the second modalpopup over the first? (so that the second disable the first)

I need to simulate multiple cascading modalpopups (enabling only the lastone)

thanks

Andres



Hi

Yes, It is possible.

Do it like this:

<%@. Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<style type="text/css">
.modalBackground {
background-color:Gray;
filter:alpha(opacity=70);
opacity:0.7;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:LinkButton ID="LinkButton1" runat="server" Text="Click" />
<asp:Panel ID="Panel1" runat="server" Style="display: none">
<div>
<asp:Button ID="OkButton" runat="server" Text="OK" />
<asp:Button ID="CancelButton" runat="server" Text="Cancel" />
<asp:LinkButton ID="LinkButton2" runat="server" Text="Click" />
</div>
</asp:Panel>
<asp:Panel ID="Panel2" runat="server" Style="display: none">
<div>
<asp:Button ID="Button1" runat="server" Text="Button1OK" />
<asp:Button ID="Button2" runat="server" Text="Button2Cancel" />
</div>
</asp:Panel>
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender" runat="server" TargetControlID="LinkButton1"
PopupControlID="Panel1" OkControlID="OkButton" BackgroundCssClass="modalBackground"
CancelControlID="CancelButton" />
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="LinkButton2"
PopupControlID="Panel2" OkControlID="Button1"BackgroundCssClass="modalBackground"
CancelControlID="Button2" />
</div>
</form>
</body>
</html>

Best Regards

multiple tabs which get dynamically filled with user controls

Hey guys, i'm new to this stuff. I've searched for hours but couldn't find an appropriate solution for my problem. i'm sure that it's not a big deal, but somehow i can't figure out how to solve this.

the problem is the following:

I have a website with a menu and other not so importent content on it. There is also a TabContainer inside an UpdatePanel.

I want to implement multiple Tabs which contain a single UserControl for each Tab. These Tabs should be add -and removable. So when i click on button of the menu a new Tab opens up and gets filled with the correct User Control.

I've tried the following:

Dim myTab As New AjaxControlToolkit.TabPanel
Dim Member As System.Web.UI.Control = LoadControl("~/Member.ascx")
myTab.Controls.Add(Member)
TabContainer1.Tabs.Add(myTab)

Somehow i get a tab, but i have to click on the tab to display my user control at the same time i get an ArgumentOutOfRangeException followed by a time out.

Any idea what i've done wrong?

thanks in advance!

Need to see your code if possible


Yes, please show us a simple repro. It's hard to tell why from your current description.


It's more a question in general. Is it correct that i only place the tabcontainer on my page and add the tabpanels dynamically via my code behind file?..like already mentioned in the post before:

Dim myTab As New AjaxControlToolkit.TabPanel
Dim Member As System.Web.UI.Control = LoadControl("~/Member.ascx")
myTab.Controls.Add(Member)
TabContainer1.Tabs.Add(myTab)

What else do I have to take care of when I want to implement add and removeable tabs? i think it's not possible to add and remove updatepanels at runtime right?

I figured out that the "ArgumentOutOfRangeException" disapears if I put the code above in the page init event, but that doesn't really help me at all, because the Tabpanels should be created when i click on one of my menu buttons.

thanks in advance!


Generally, the code and logic you've shown is correct.

I'm asking for a simple repro because I'm not sure where is the exception thrown, and suspect this might have something to do with the page life cycle.


I fixed the exception by adding the code into the page init event (the user control was loaded into a tab before it existed). i'm sure your're right that it has something to do with my page life cycle. The question is: is it possible to remove and add the same tab during the page life cycle?

Thanks for the quick reply!


muffos:

The question is: is it possible to remove and add the same tab during the page life cycle?

Yes, of course you can.


Hallo again,

The page works perfect if I add the TabPanel with the UserControl inside during the page_init event, but that is not a fitting solution. If I put the code that adds the Tabpanel in a button click event the tab is not displayed and I get an error like the following (translated error message):

An Error occured during the validation of the ViewState-MAC. If this apllication was hosted by a webfarm or a cluster make sure that the <machineKey> configuration indicates the same validationKey and validation algorithm. AutoGenerate can not be used in a cluster.

Any idea why i get this error?

Could you give me a short example of a aspx page where you at and remove ajax tabs by clicking on a button?

I really appreciate your help!


I found an older thread where they were discussing the same problem that I have right now.

http://forums.asp.net/p/1077423/1595745.aspx

They didn't find a solution either. Ideas on this?!?!


<%@. 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"> protected void LinkButton1_Click(object sender, EventArgs e) { TabContainer1.Tabs.RemoveAt(TabContainer1.ActiveTabIndex); }</script><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> </div> <ajaxToolkit:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0"> <ajaxToolkit:TabPanel ID="TabPanel1" runat="server" HeaderText="TabPanel1"> <ContentTemplate> Tab 1 </ContentTemplate> </ajaxToolkit:TabPanel> <ajaxToolkit:TabPanel ID="TabPanel2" runat="server" HeaderText="TabPanel2"> <ContentTemplate> Tab 2 </ContentTemplate> </ajaxToolkit:TabPanel> <ajaxToolkit:TabPanel ID="TabPanel3" runat="server" HeaderText="TabPanel3"> <ContentTemplate> Tab 3 </ContentTemplate> </ajaxToolkit:TabPanel> </ajaxToolkit:TabContainer> <asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click">Remove Current Tab</asp:LinkButton> </form></body></html>
Is this what you need?

Well, I managed to add one dynamically created tab with a user control inside without getting any error. Somehow i'm not able to add any more Tabs.

Here is my current code:

PartialClass _Default

Inherits System.Web.UI.Page

Private _memberAs System.Web.UI.Control

Private _TestSeite2As System.Web.UI.Control

ProtectedSub Page_Load(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.Load

TimeLabel.Text = DateTime.Now

EndSub

ProtectedSub LinkButton1_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles LinkButton1.ClickDim myTabAsNew AjaxControlToolkit.TabPanel

TabContainer1.ActiveTabIndex = 0

myTab.Visible =True

EndSub

ProtectedSub LinkButton2_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles LinkButton2.ClickDim myTab2AsNew AjaxControlToolkit.TabPanel

TabContainer1.ActiveTabIndex = 1

myTab2.Visible =True

EndSub

ProtectedSub TabContainer1_Init(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles TabContainer1.Init

If Page.IsPostBackThen

TabContainer1.Tabs.Clear()

_member = LoadControl("~/Member.ascx")

Dim myTabAsNew AjaxControlToolkit.TabPanel

myTab.HeaderText ="Tab 1"

TabContainer1.Tabs.AddAt(0, myTab)

myTab.Controls.Add(_member)

EndIf

//// i know that the following loop doesn't make any sence, it's just the result of my frustration :)

If Page.IsPostBackThen

_member = LoadControl("~/Testseite2.ascx")

Dim myTab2AsNew AjaxControlToolkit.TabPanel

myTab2.HeaderText ="Tab 2"

TabContainer1.Tabs.AddAt(1, myTab2)

myTab2.Controls.Add(_member)

myTab2.Visible =True

EndIf

EndSub

EndClass

//////////////////////and here my aspx page:

<%@.PageLanguage="VB"AutoEventWireup="true"CodeFile="ItellU.aspx.vb"Inherits="_Default"enableEventValidation="false"viewStateEncryptionMode="Never"enableViewStateMac="false" %>

<%@.RegisterSrc="Member.ascx"TagName="Member"TagPrefix="uc1" %>

<%@.RegisterSrc="Testseite2.ascx"TagName="Testseite2"TagPrefix="uc1" %>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headid="Head1"runat="server">

<title>Untitled Page</title>

<linkhref="StyleSheet.css"rel="stylesheet"type="text/css"/>

</head>

<bodystyle="background-color: #e3efff">

<formid="form1"runat="server">

<asp:ScriptManagerID="ScriptManager"runat="server"EnablePartialRendering="true">

</asp:ScriptManager>

<div>

<asp:UpdatePanelID="UpdatePanel1"runat="server"UpdateMode="conditional"ChildrenAsTriggers="false">

<ContentTemplate>

<asp:PanelID="Timer"style="z-index:100; position: absolute; top: 584px; left: 27px"runat="server"Height="50px"Width="125px">

<asp:UpdatePanelID="UpdatePanelTimer"runat="server">

<ContentTemplate>

<asp:LabelID="TimeLabel"runat="server"style="vertical-align: middle; border-top-style: none; border-right-style: none; border-left-style: none; background-color: white; text-align: center; border-bottom-style: none"BackColor="White"Height="25px"Width="180px"></asp:Label>

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTriggerControlID="Timer1"EventName="Tick"/>

</Triggers>

</asp:UpdatePanel>

</asp:Panel>

<asp:TimerID="Timer1"runat="server"Interval="900">

</asp:Timer>

<tablestyle="z-index: 119; left: 234px; width: 897px; position: absolute; top: -4px; height: 844px; border-left-color: #a9c0df; border-bottom-color: #a9c0df; border-top-style: ridge; border-top-color: #a9c0df; border-right-style: ridge; border-left-style: ridge; border-right-color: #a9c0df; border-bottom-style: ridge;">

<tr>

<tdstyle="width: 437px; height: 443px"valign="top">

<ajaxToolkit:TabContainerID="TabContainer1"runat="server"height="0px"OnInit="TabContainer1_Init">

</ajaxToolkit:TabContainer>

</td>

</tr>

</table>

<asp:LinkButtonID="LinkButton1"runat="server"Style="z-index: 108; left: 10px;

position: absolute; top: 120px;"CssClass="linkbuttonBlue">neue Auftragsdienstleistung

</asp:LinkButton>

<asp:LinkButtonID="LinkButton2"runat="server"Style="z-index: 109; left: 10px;

position: absolute; top: 143px;"CssClass="linkbuttonBlue">GDL Zuordnung

</asp:LinkButton>

</asp:Panel>

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTriggerControlID="LinkButton1"EventName="Click"/>

<asp:AsyncPostBackTriggerControlID="LinkButton2"EventName="click"/>

</Triggers>

</asp:UpdatePanel>

</div>

</form>

<scripttype="text/javascript">

function setBodyHeightToContentHeight() {

document.body.style.height = Math.max(document.documentElement.scrollHeight,

document.body.scrollHeight)+"px";

}

setBodyHeightToContentHeight();

window.attachEvent('onresize', setBodyHeightToContentHeight);

</script>

</body>

</html>

please remember, that i'm new to this stuff :)

thanks in advance!


What's wrong with your code? I suppose it's working fine.

Two panels are created, and whenever you click on a linkButton, a corresponding tab panel will be actived.

<%@. Page Language="VB" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><script runat="server"> Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load TimeLabel.Text = DateTime.Now End Sub Protected Sub LinkButton1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles LinkButton1.Click Dim myTab As New AjaxControlToolkit.TabPanel TabContainer1.ActiveTabIndex = 0 myTab.Visible = True End Sub Protected Sub LinkButton2_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles LinkButton2.Click Dim myTab2 As New AjaxControlToolkit.TabPanel TabContainer1.ActiveTabIndex = 1 myTab2.Visible = True End Sub Protected Sub TabContainer1_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles TabContainer1.Init If Page.IsPostBack Then TabContainer1.Tabs.Clear() Dim _member As New TextBox() '= LoadControl("~/Member.ascx") Dim myTab As New AjaxControlToolkit.TabPanel myTab.HeaderText = "Tab 1" TabContainer1.Tabs.AddAt(0, myTab) myTab.Controls.Add(_member) End If '//// i know that the following loop doesn't make any sence, it's just the result of my frustration :) If Page.IsPostBack Then Dim _member As New TextBox() ' = LoadControl("~/Testseite2.ascx") Dim myTab2 As New AjaxControlToolkit.TabPanel myTab2.HeaderText = "Tab 2" TabContainer1.Tabs.AddAt(1, myTab2) myTab2.Controls.Add(_member) myTab2.Visible = True End If End Sub </script><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"><title>Untitled Page</title><link href="StyleSheet.css" rel="stylesheet" type="text/css" /> </head><body style="background-color: #e3efff"><form id="form1" runat="server"><asp:ScriptManager ID="ScriptManager" runat="server" EnablePartialRendering="true"></asp:ScriptManager><div><asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional" ChildrenAsTriggers="false"><ContentTemplate> <asp:Panel ID="Timer" style="z-index:100; position: absolute; top: 584px; left: 27px" runat="server" Height="50px" Width="125px"> <asp:UpdatePanel ID="UpdatePanelTimer" runat="server"> <ContentTemplate> <asp:Label ID="TimeLabel" runat="server" style="vertical-align: middle; border-top-style: none; border-right-style: none; border-left-style: none; background-color: white; text-align: center; border-bottom-style: none" BackColor="White" Height="25px" Width="180px"></asp:Label> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" /> </Triggers> </asp:UpdatePanel> </asp:Panel><asp:Timer ID="Timer1" runat="server" Interval="900"></asp:Timer> <table style="z-index: 119; left: 234px; width: 897px; position: absolute; top: -4px; height: 844px; border-left-color: #a9c0df; border-bottom-color: #a9c0df; border-top-style: ridge; border-top-color: #a9c0df; border-right-style: ridge; border-left-style: ridge; border-right-color: #a9c0df; border-bottom-style: ridge;"><tr><td style="width: 437px; height: 443px" valign="top"> <ajaxToolkit:TabContainer ID="TabContainer1" runat="server" height="0px" OnInit="TabContainer1_Init"></ajaxToolkit:TabContainer> </td></tr></table><asp:LinkButton ID="LinkButton1" runat="server" Style="z-index: 108; left: 10px;position: absolute; top: 120px;" CssClass="linkbuttonBlue">neue Auftragsdienstleistung</asp:LinkButton> <asp:LinkButton ID="LinkButton2" runat="server" Style="z-index: 109; left: 10px;position: absolute; top: 143px;" CssClass="linkbuttonBlue">GDL Zuordnung</asp:LinkButton> </ContentTemplate><Triggers><asp:AsyncPostBackTrigger ControlID="LinkButton1" EventName="Click"/><asp:AsyncPostBackTrigger ControlID="LinkButton2" EventName="click"/></Triggers></asp:UpdatePanel></div></form><script type="text/javascript">function setBodyHeightToContentHeight() {document.body.style.height = Math.max(document.documentElement.scrollHeight,document.body.scrollHeight)+"px";}setBodyHeightToContentHeight();window.attachEvent('onresize', setBodyHeightToContentHeight);</script> </body></html>

I found a solution, check this out.

it works nearly perfect, but i use a hidden tab to keep my tabcontainer alive. I think this code might help you if you want to implement AJAX Tabs with rich functionality.

PartialClass _Default

Inherits System.Web.UI.Page

Private _memberAs System.Web.UI.Control

Private _TestSeite2As System.Web.UI.Control

Private myTabAs AjaxControlToolkit.TabPanel

Private myTab2As AjaxControlToolkit.TabPanel

Private tabbitabAs AjaxControlToolkit.TabPanelProtectedSub Page_Load(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.Load

TimeLabel.Text = DateTime.Now

If Session.Item("CreateTab")IsNothingThen

Session.Add("CreateTab",False)

EndIf

EndSub

ProtectedSub LinkButton1_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles LinkButton1.Click

If Session.Item("button1clicked")IsNothingThen

Session.Add("button1clicked",True)

Else

Session.Item("button1clicked") =True

EndIf

If Session.Item("UpdateUpdatePanel")IsNothingThen

Session.Add("UpdateUpdatePanel",True)

Else

Session.Item("UpdateUpdatePanel") =True

EndIf

EndSub

ProtectedSub LinkButton2_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles LinkButton2.Click

If Session.Item("button2clicked")IsNothingThen

Session.Add("button2clicked",True)

Else

Session.Item("button2clicked") =True

EndIf

If Session.Item("UpdateUpdatePanel")IsNothingThen

Session.Add("UpdateUpdatePanel",True)

Else

Session.Item("UpdateUpdatePanel") =True

EndIf

EndSub

ProtectedSub TabContainer1_ActiveTabChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles TabContainer1.ActiveTabChanged

EndSub

ProtectedSub TabContainer1_Init(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles TabContainer1.Init

If IsPostBackThen

TabContainer1.Tabs.Clear()

If Session.Item("CreateTab")Then

tabbitab =New AjaxControlToolkit.TabPanel

tabbitab.HeaderText =""

TabContainer1.Tabs.Add(tabbitab)

TabContainer1.ActiveTab = tabbitab

TabContainer1.ActiveTabIndex = TabContainer1.Tabs.Count

EndIf

If Session.Item("button1clicked")Then

_member = LoadControl("~/Member.ascx")

myTab =New AjaxControlToolkit.TabPanel

myTab.HeaderText ="neue Auftragsdienstleistung"

TabContainer1.Tabs.Add(myTab)

myTab.Controls.Add(_member)

TabContainer1.ActiveTab = myTab

TabContainer1.ActiveTabIndex = TabContainer1.Tabs.Count

EndIf

If Session.Item("button2clicked")Then

_member = LoadControl("~/Testseite2.ascx")

myTab2 =New AjaxControlToolkit.TabPanel

myTab2.HeaderText ="GDL Zuordnung"

TabContainer1.Tabs.Add(myTab2)

myTab2.Controls.Add(_member)

TabContainer1.ActiveTab = myTab2

TabContainer1.ActiveTabIndex = TabContainer1.Tabs.Count

EndIf

If Session.Item("UpdateUpdatePanel")Then

UpdatePanel1.Update()

Session.Item("UpdateUpdatePanel") =False

EndIf

EndIf

EndSub

ProtectedSub CloseTabButton_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles CloseTabButton.Click

If IsPostBackThen

Try

If TabContainer1.ActiveTabIs myTabThen

Session.Item("button1clicked") =False

EndIf

If TabContainer1.ActiveTabIs myTab2Then

Session.Item("button2clicked") =False

EndIf

Catch exAs Exception

Session.Item("button1clicked") =False

Session.Item("button2clicked") =False

EndTry

Session.Item("UpdateUpdatePanel") =True

Session.Item("CreateTab") =True

EndIf

EndSub

EndClass

Multiple Targets for Extenders?????

hi

is there any possibility for using a single extender for multiple targetcontrol ids?

for eg..

if u have 10 textboxes and we wan to addfilteredtextboxextender to all the textboxes,can use singlefilteredtextboxextender for all 10 textboxes?

Thanks in advance

Hi,

no, in beta1 an extender must target one server control.


whether it ll affect the performance when using large number of extenders in a single page

Multiple Timers and Multiple UpdatePanels

I am creating a page with many different server controls that each need to automatically refresh independently. I want the developer to be able to specify the refresh time, so I am exposing that as a property of the control. The problem is, whenever the first timer ticks, all the other timers reset (and the label control in each UpdatePanel updates with the current time) even though they are on different intervals. It acts like all the UpdatePanels are posting back, but I know the tick event is only firing on the first timer (the one with the lowest interval). Any ideas as to what's happening here or what I'm doing wrong?

Here is my (raw, not refactored) code (CreateChildControls method):

If AutoUpdateThen Dim panelAs UpdatePanel =New UpdatePanel()Dim progressAs UpdateProgress =New UpdateProgress() _label =New WebControls.Label()Dim timerAs Timer =New System.Web.UI.Timer() panel.ID =Me.ID +"_UpdatePanel" panel.ChildrenAsTriggers =True panel.UpdateMode = UpdatePanelUpdateMode.Conditional timer.ID = panel.ID +"_RefreshTimer"#If DEBUG Then timer.Interval = IIf(RefreshSeconds <> 0, RefreshSeconds, _refreshMinutes)#Else timer.Interval = _refreshMinutes#End If AddHandler timer.Tick,AddressOf OnTimerTick panel.ContentTemplateContainer.Controls.Add(timer) _label.Text =String.Format("Updated at: {0}", DateTime.Now) panel.ContentTemplateContainer.Controls.Add(control) panel.ContentTemplateContainer.Controls.Add(_label) control = panelEnd If
I've also tried creating the timers outside the UpdatePanels and adding an ASyncPostBack trigger on the Tick event of each timer like so:
 
If AutoUpdateThen Dim panelAs UpdatePanel =New UpdatePanel()Dim progressAs UpdateProgress =New UpdateProgress()Dim timerTriggerAs New AsyncPostBackTrigger() _label =New WebControls.Label()Dim timerAs Timer =New System.Web.UI.Timer() panel.ID =Me.ID +"_UpdatePanel" panel.ChildrenAsTriggers =False panel.UpdateMode = UpdatePanelUpdateMode.Conditional timer.ID = panel.ID +"_RefreshTimer"#If DEBUG Then timer.Interval = IIf(RefreshSeconds <> 0, RefreshSeconds, _refreshMinutes)#Else timer.Interval = _refreshMinutes#End If timerTrigger.ControlID = timer.ID timerTrigger.EventName ="Tick" Controls.Add(timer) panel.Triggers.Add(timerTrigger) _label.Text =String.Format("Updated at: {0}", DateTime.Now) panel.ContentTemplateContainer.Controls.Add(control) panel.ContentTemplateContainer.Controls.Add(_label) control = panelEnd If
Thanks! 

D'oh!


A detail I had failed to mention previously was that these update panels are contained within a surrounding update panel. This panel was set to UpdateMode = Always, which was causing all of the UpdatePanels inside of it to automatically update. I set it to conditional and it seems to work fine now.

-Joe

Multiple Timers - Only on is ticking

Hi,

I have several UpdatePanels and a timer in each of them, as every panel has to be updated at different intervals. However, using the ASP.NET AJAX timer, only one is triggered and it seems to reset the other timers on the postback and thus the others never trigger. I was testing the Telerik Timer control and all of them were ticking properly, however it looks like they caused a memory leak in the WebDevServer as when using them, memory consumption always quickly shot up to over 1 GB.

Does anyone know of a fix or workaround how to get all timers ticking properly?

Thanks

Hi Daikoku,

as discussed inhttp://forums.asp.net/thread/1648410.aspx, the Ajax timers get reset on postback (even if they are in different update panels). I think they have only begun delving into the potential of these controls. I do not know that there is anything you can do about this behavior at this time.


Hi,

as soon as you put the Timers into the UpdatePanels, they will be reset after a partial postback.

Have you tried putting the Timers outside the UpdatePanels and referencing them as AsyncPostBack triggers?


When I place the timers outside the UpdatePanel, the whole page is reloaded on every tick

Hi,

if the timers are placed outside the UpdatePanel, you should add them as AsyncPostBack triggers for the UpdatePanel.


Thanks, that seems to work

Here is a solution I was able to use. Perhaps this will help someone visualize it. I have two timers counting off; 1 counts seconds, the other counts 60 seconds. each triggers an update panel which adds a number to a labels current integer value and re-enabled the calling trigger.

// codebehindprotected void Page_Load(object sender, EventArgs e) {if (!IsPostBack) { Label1.Text ="0"; Label2.Text ="0"; } }protected void Timer1_Tick(object sender, EventArgs e) {int Time1 = Convert.ToInt16(Label1.Text); Time1 += 1; Label1.Text = Time1.ToString();if (Time1 >= 120)// stop the timer after two minutes ((Timer)sender).Enabled =false;else ((Timer)sender).Enabled =true; }protected void Timer2_Tick(object sender, EventArgs e) {int Time2 = Convert.ToInt16(Label2.Text); Time2 += 1; Label2.Text = Time2.ToString(); ((Timer)sender).Enabled =true; }
 <div> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> Seconds: <asp:Label ID="Label1" runat="server" Style=""></asp:Label> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="Timer1" /> </Triggers> </asp:UpdatePanel> <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional"> <ContentTemplate> Minutes: <asp:Label ID="Label2" runat="server" Style=""></asp:Label>  </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="Timer2" /> </Triggers> </asp:UpdatePanel> </div> <asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick"> </asp:Timer> <asp:Timer ID="Timer2" runat="server" OnTick="Timer2_Tick"> </asp:Timer>

Multiple UCs on a page

On my page I have two User Controls. One, UC1, has a DropDownList. The other one, UC2, is a list that gets data from a SqlDataSource (datasourcetype=strored procedure), by Repeater.

Whenever the ddl in UC1 is changed, it triggers a function that puts a log record into the database from which UC2 gets the data.

I need the new log record to appear immediately after the selected index of ddl is changed, but it only appears after I refresh the page.

I can't create any triggers for the UpdatePanel of UC1, because the controls are in different UCs.

I tried to use delegates and events, but unsuccessful. My knowledge in that area is limited.

You should be able to use triggers for the update panel even though they are different controls.
Can you post your code?
You can also just refresh the page in code...


Make sure they are both in updatepanels, and set both toUpdateMode="Always". Then, when one updates, the other automatically updates.

Multiple Update Panels - Postback on Panel A cancels Postback on Panel B

Hi,

I have a page with multiple Update Panels. Each panel has a button as a trigger.

When the first button is clicked it causes the first panel to update (as you'd expect), however if while this panel is being updated, the second button is clicked to update the second panel, the first request is cancelled, and the first panel is never updated.

Is this the expected behavior? Are there any work arounds?

Many Thanks,
Ady

Yes, unfortunately it is by design. Only the last UpdatePanel requets will be considered and prior reuests discarded.

Hmm, thats a shame.

I wonder if there is a way to intercept the request, and effectively queue it until the first request completes.

Time to start playing.


This tutorial might help you get started:http://ajax.asp.net/docs/tutorials/ExclusiveAsyncPostback.aspx.

multiple update panels

hi every one..

i am using multiple update panels (more than 10) on a web page in my Ajax enabled asp.net website.

I would like to know whether it is feasible to use so many Update panels in a single form (one for each control which will go to server), or there is a possibility that i will face some problem due to it.

Any alternatives are also welcome.

thanx,

viraj

hello.

using several updatepanels might be a good approach if the zones wrapped by the panels should be refresed independently. in this case, setting the updatemode to conditional will result in reducing the size of the response returned from the server side. I'm not sure if there's any recommendation in the number of itens UpdatePanels that should be used in a page.


thanx...

Multiple update panels

I had a query regarding multiple update panels.
I have a user control which contains one update panel.This user control contains a hidden textbox .
I am updating the updatepanel on basis of a timer control in javascripts which raises a postback.

I have placed two instances of this user control in another page say for eg. CIndexPage.aspx.
Now the Script manager is also placed in the same page ie CIndexPage.aspx.

Will the two updatepanels wrk independently.

Is the hidden variable shared between the instances of the update panel ?
Becoz the issue here is that even if i pass a value for the hidden textbox contained
in the first Update Panel, still the value gets stored for the hidden
variable in the second instance of the updatePanel.

Can we use Update Panels in a User Control and place multiple instances of the UserControls in a page.

Please if someone cld help me with this.

Thanks in advance.

Regards,
Shweta

hello.

well, the updatepanels will work independently. if you want to get independent refershes, you need to make sure that you've set the update mode of the pannel to conditional.

regarding the hidden field, it depends on how you've injected in the page...


Hi,

My Code is somewhat like this

User Control contains

_____________________________________________________________

<asp:UpdatePanel id=UpdatePanel1 runat=server>
<div id=DivCtrl runat=server >
<asp:HiddenField runat="server" ID="RequestID" Value="0" />
</UpdatePanel>


____________________________________________________________________
There is adiv control which contains multiple hyperlinks.That is done thru .cs file of the Master Control and is dynamically generated.
The hidden filed in placed inside the UpdatePanel and the RequestID is updated on the hyperlink click.

And 2 instances of this user control are placed in the Parent Page.
Also what happens is even though i am clicking on the first User Controls hyperlink (first updatepanel) still the Value is assigned to the second User Controls Hidden Field.

It always updates the last user control.

Why does work in this manner . Also to update the UpdatePanel i am using the timer control and _dopostback method.

Is there an issue with the timer control.Shld that be placed in the ParentPage.

regards,

Shweta


hello.

can you please build a small demo app with a simple user control + page and put it here?


yes sure
------------
User Control Code is as follows for .aspx is as follows
-------------
<script language =javascript>
var l_objtimer="";
l_objtimer =window.setInterval('UPdatePanel',1000);
function UPdatePanel()
{
var obj=get$('<%=RequestID.ClientID%>');
_dopostback("obj",'');
}

function CallDetails(nSerialNo)
{
var obj=get$('<%=RequestID.ClientID%>');
obj.value=nSerialNo;
_dopostback("obj",'');
}
</script>
<body>
<asp:UpdatePanel id=UpdatePanel1 runat=server>
<div id=DivCtrl runat=server >
<asp:HiddenField runat="server" ID="RequestID" Value="0" />
</UpdatePanel>
</body>

------------
end
-------------

------------
User Control Code is as follows for cs is as follows
-------------

In this i dynamically adding a hyperlink whose onclick events call CallDetails(nSerialNo) (in .aspx of user control).
And pass different value to the nSerialNo parameter on the click event.In the event i change the value of RequestID to the the nSerialNo.

------------
end
-------------

------------
Parent Page Code is as follows for .aspx is as follows
-------------
<%@. Register TagPrefix="csc" Namespace="CustomServerControls" %>
<body>
<asp:ScripManager runat=server id=ScriptMgr1 >
</asp:ScripManager >
<csc:CustomServerControls id=CustomServer1 runat=server >
</csc:CustomServerControls>

<csc:CustomServerControls id=CustomServer2 runat=server >
</csc:CustomServerControls>

</body>

------------
end
-------------

This way 2 instances of this user control are placed in the Parent Page.
Also what happens is even though i am clicking on the first User Controls hyperlink (first updatepanel) still the Value is assigned to the second User Controls Hidden Field.

Also if i am placing the usercontrol in a page and call the page thru <script tag by specifying the source it gives me a Syntax error.

Can i call the page in this way.


hello

well, now it's clear!. what you shoud do is change the js code. you should have something like this:

<script language =javascript>
var l_objtimer="";
l_objtimer =window.setInterval('UPdatePanel',1000);
function UPdatePanel(idCtl)
{
var obj=get$(idCtl);
_dopostback("obj",'');
}

function CallDetails(idCtl, nSerialNo)
{
var obj=get$(idCtl);
obj.value=nSerialNo;
_dopostback("obj",'');
}
</script>

where idCtl is the ID of the control (hidden field) you want to use. yep, you'll have to change your code so that it also passes the id of the field when you call the method.

in your code, what's happening is that when you're adding the second user control, it'll add the js methods again, overriding the previous definitions. this means that clicking on the 1st or 2nd user control will always call the latest definition, which points to the id of the last user control you've added to the page. if you perform the changes I've said, this won't happen any more.

Multiple Update Panels

Evening all,

As part of a larger development, I had an idea to develop a quiz using two update panels on one page. My idea was that the first update panel would have two dropdown lists binded to a database. Dropdown list 1 would hold the question. When the user selected an entry from the list, the 2nd dropdown list would populate with the answer. I added a delay using theSelectedIndexChanged event as follows:

Protected

Sub DropDownList1_SelectedIndexChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)

System.Threading.Thread.Sleep(10000)

EndSub

I also added an updateProgress control to displayTime is running out.

Now the 2nd update panel had a simple text field and a button. The idea was that the user would try to beat the controls in updatePanel1 displaying the result. The user would enter their answer and click submit. This would then be compared to the actual write answer and a score would be recorded. I guess you have enough here to get my drift.

Now the big problem with this is that whilst updatePanel1 is updating, any event in updatePanel2 throws an error along the lines of: "Invalid Postback or callback argument".

From what I can gather from the complete error message, some sort of validation has been actioned and these simultaneous callbacks/postbacks can't happen. Is this just the way it is or is their a way around this. The error message makes reference to setting a pages element in the config file with the attribute "enableEventValidation=True". Now this stops me getting the error message in my page, but the lists in updatePanel1 don't display the right data.

Any tips on this or idea's on how to achieve my original concept would be hugely appreciated. I have included the relevant code below.

Kind regards

Mike

<

asp:ScriptManagerID="ScriptManager1"runat="server"EnablePartialRendering=true/><div><asp:UpdatePanelID="UpdatePanel1"runat="server"RenderMode="Inline"UpdateMode="Conditional"><ContentTemplate><asp:DropDownListID="DropDownList1"runat="server"DataSourceID="AccessDataSource1"DataTextField="question"DataValueField="qID"AutoPostBack=TrueOnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"></asp:DropDownList><asp:DropDownListID="DropDownList2"runat="server"DataSourceID="AccessDataSource2"DataTextField="answer"DataValueField="answer"OnSelectedIndexChanged="DropDownList2_SelectedIndexChanged"AutoPostBack="True"></asp:DropDownList><asp:AccessDataSourceID="AccessDataSource2"runat="server"DataFile="~/App_Data/quiz.mdb"SelectCommand="SELECT * FROM [answer] WHERE ([qID] = ?)"><SelectParameters><asp:ControlParameterControlID="DropDownList1"Name="qID"PropertyName="SelectedValue"Type="Int32"/></SelectParameters></asp:AccessDataSource><asp:AccessDataSourceID="AccessDataSource1"runat="server"DataFile="~/App_Data/quiz.mdb"SelectCommand="SELECT * FROM [questions]"></asp:AccessDataSource><asp:UpdateProgressID="UpdateProgress1"runat="server"DisplayAfter="0"><ProgressTemplate>

Hurry up.......

</ProgressTemplate></asp:UpdateProgress></ContentTemplate>

</asp:UpdatePanel><br/><hr/><asp:UpdatePanelID="UpdatePanel2"runat="server"RenderMode="Inline"ChildrenAsTriggers=falseUpdateMode="Conditional">

<ContentTemplate>

<asp:ButtonID="Button1"runat="server"Text="Button"OnClick="Button1_Click"OnDataBinding="Button1_DataBinding">

</asp:button>

<asp:TextBoxID="TextBox1"runat="server"></asp:TextBox></ContentTemplate></asp:UpdatePanel>

I seem to have solved the initial error message problem by nesting the updatePanels as opposed to having 2 independent panels. I'll continue with this and see how I get on.

Any tips from anybody else would be hugely appreciated.

Kin Regards

Mike

Multiple Update Panel Animation Extenders on one page

Hi there!

I'm developing a web user control that contains an Update Panel and uses an Update Panel Animation Extender.
The animation is quite simple: while the panel is updating, it fades out the contents of the update panel and fades in the "please wait while processing..." message...then the animation reverses the process when the panel is Updated. The animation works quite nicely.

The problem I'm facing is when I have more than one of these web user controls on the page at a time (I'm using 8 of these on one page at a time).
If one web user control's update panel does an asynchronous postback, all of the animations are run!

Does anyone know how to get around this problem?

Thanks in advance,

-Frinny

Hi,

Would you please provide with any code of ypur usercontrol?

Or create a simple repro of this problem?

Thanks,


I forgot that I had posted this question.
I found the solution to my problem a while ago.

The problem I was describing is not actually a problem, it is how the UpdatePanelAnimationExtender works.

Anyways, to get around this problem I ended up using regular Animations instead of the UpdatePanelAnimationExtender.

Cheers!

Multiple update panels: content disappears when modalpopup is used

Hello there,

I'm experiencing a rather annoying issue at the moment. I'm working on a webapplication, which contains quite a big page. This page contains multiple updatepanels, which in their turn contain dropdownlists/checkboxes. The page also uses a TextboxWatermarkExtender on one textbox control, and a ModalPopup which is shown conditionally by calling .Show() from the codebehind.

The ModalPopupExtender and TextboxWatermarkExtender are not on an updatepanel or anything.

Everything seems to work as it should, but I'm having a rather annoying cosmetic issue: at the moment the modalpopup is shown on my page, all the content of the updatepanels dissapears: none of the dropdownlistboxes are visible anymore!

Something weird also happens when I do any action in any of the updatepanels: when I do this, the TextboxWatermarkExtender seems to "refresh" its text (you see the text "flash").

I'm thinking these issues might be connected somehow... Has anyone got any idea on how to solve this issue, or has anyone else ran into this?

I took a few screnshots to illustrate the problem.

This is how the page looks without the modal popup:

This is with the modal popul:

As you can see, all the dropdownboxes have disappeared. Also, I noticed not only the dropdownboxes in updatepanels diasppear, but those that aren't also disappear.

Any ideas/suggestions? Tnx!


No-one? :( I've been looking all over the internet for this, but I can't seem to find anyone having the same issue. I do find issues with dropdownboxes floating "on top of" a layer when using Internet Explorer, but that's not the problem I have here... Also, I noticed this behaviour doesn't appear in Firefox: everything looks ok when using that browser...

My DDL(s) also disapeer with modal popup!!

And I had another problem with them when the modal popup causes a postback.

So I solved that by wrapping my DDL in another update panel... (with updatemode="always", dunno if that was necessary...)

But it seems to be working now...


And another update: I installed IE7 recently, and in that browser, the problem seems to be solved: the dropdownboxes don't disappear anymore.

So, this really seems to be an IE6-browser issue. I tried putting the ddl's in updatepanels (some of them already were), but that didn't help...

Browser-specific issues... gotta hate 'em ;-)

Multiple update panels with triggers

I'm having a hard time figuring out how to accomplish the following. Any help would be GREATLY appreciated:

I have a section with radiobuttonlists and checkboxes. I wrapped them in an updatepanel and they work great.

The problem is that the radiobuttonlists and checkboxes also have customvalidators on them, which unfortunately doesn't work correctly. My validatorsummary is at the bottom of the page and is not included in the updatepanel. What do I need to do to get all this to work properly?

Thanks!

In what way is it not working properly?


If they aren't in an UpdatePanel, they can't update as result of a partial postback. One thing you can do is put them in another UpdatePanel with async postback triggers for the checkboxes and radiobuttons.

hi

Do have try to use ValidatorCallout control of ajax control toolkit i think it may help you


DisturbedBuddha:

In what way is it not working properly?

On the custom validator, I set text="*" and errorMessage="Danger Will Robinson"... I see the * next to the control that is in the updatePanel, but the error message does not display in the validatorsummary, which is outside of the updatePanel


qt1329a is slightly mistaken. The validation summary should appear even if not placed in an update panel. Validation always occurs on the server, but unless you've specifically disabled client-side validation, it will validate in the browser first and cancel the post to the server if there is a problem. For an in-depth explanation of how that works, read "Client-Side Validation" athttp://quickstarts.asp.net/QuickStartv20/aspnet/doc/validation/default.aspx. So basically, a postback is not usually required for a validator to fire.

Some versions of the validators (as well as other controls) are not compatible with the UpdatePanel. You can try this fix: http://blogs.msdn.com/mattgi/archive/2007/01/23/asp-net-ajax-validators.aspx

But in the meantime, you could post your source code and I can see if it's just a simple correction.

Multiple Update Panels Question

I'm not sure if this is an ATLAS issue or the way I'm setting this up. What I'm trying to do is have two gridviews updated when one button is clicked. When the user clicks the button the results are returned, but only when all queries to the database are complete. What I want to happen is to update the gridview to display data whenever either query completes so the user can see some data while the oter still loads. Any ideas on how to achieve this?

You need to split up your panels and make sure you're updatemode is set to Conditional. By default Always is used which updates all panels at once. You'll also need to figure out an effective way to trigger the functionality so that you essentially generate two separate callbacks to the server. Maybe click the button and fire the first update, then set a timer and fire another button to start the other update separately.

There's no real clean way to do this with UpdatePanel since it lacks a client side model at the moment. What I do for this is use 'phantom' buttons on a page that are invisible (style.display='none') but are hooked up as triggers for the UpdatePanel. It's a hack for sure, but it's easy enough to do.

Rumor has it that the next update of ATLAS is going to provide better client control of the update panel, but we have to wait for the next refresh to see what that actually looks like.

+++ Rick --


Thanks. I figured that was the only way to do it.

Multiple Update Panels Problem

hello!

I have 4 update panels on my page, 2 of which I used to load slow loading data displayed in gridviews. I wanted to display the layout of the page before it loads the data (showing a small loading graphic in the updated divs) so the user does not think the page is stuck. To do this, I used two timer controls with interval 1 so that once the page is loaded, the timers will tick and the data will be fetched and bound to the gridviews. I am facing a few problems:

1. One gridview's data is slower than the other, and instead of the faster one displaying first then the slower one, it waits until the slower one fetches its data and then they are both displayed at the same time.

2. I have another gridview that uses a timer (interval 6000) and the timer_tick sub for it scrolls through the gridview pages. But the timer does not start ticking until the other two gridviews load.

3. The 4th update panel has a next and previous button displaying news articles. The buttons do not cause anything until the two slow panels load (just like the gridview in point 2 above).


Is there another way I can trigger the two slow gridviews to load AFTER the page loads and displays something for the user? And why do the other update panels wait for these two slow panels to finish before letting the user update them?

Your speedy support is greatly appreciated!

Make sure that you set UpdateMode="Conditional" on all the update panels to be able to update them individually. Otherwise they will all update their contents on postback.

Call UpdatePanel.Update() on the ones that should be updated.


Try delay loading your update panel like the following:
http://mattberseth.com/blog/2007/07/delay_load_an_updatepanel.html


Wow thanks for the replies! I'll try this stuff out and let you know!


OK I tried Matt Berseth's delay load approach. For some reason, the __doPostBack method does not force the button click method to be invoked. As a result, the two gridviews do not load.

<script type="text/javascript" language=javascript>
var _isInitialLoad = true;

function pageLoad(sender, args){
if(_isInitialLoad){
_isInitialLoad = false;
// simulate a button click by forcing the postback
// causing the updatepanel to update
__doPostBack("<%= me.btnHidden.ClientID %>","");
}
}
</script>

<asp:button id="btnHidden" runat="server" style="display:none;" OnClick="btnHidden_Click" />

<asp:UpdatePanel id="UpdatePanel4" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnHidden" Eventname="Click"></asp:AsyncPostBackTrigger>
</Triggers>

// the content of this panel is a gridview.. the btnHidden_Click sub binds the data to the gridview..

Any ideas?


Just an update.. I changed the dopostback call from

__doPostBack("<%= me.btnHidden.ClientID %>","")

to

__doPostBack("<%= me.btnHidden.UniqueID %>","")

that worked but the updateprogress control did not appear (the screen looked like it finished loading and then suddenly the gridviews got displayed).

I really appreciate your assistance!


Hi,

I've created a user control that I'm trying to use to delay content loading on a page for long running controls.check out this:Delaying Content Load using Timer and UpdatePanel

Best Regards


Hey man thanks for the update but the link refers to this site: http://www.null.com/t/1127147.aspx

which displays nothing! ;-) can you plz update with the proper link so i can test?

thx for ur help!


Thanks for the control Jin-Yu,

Here's the url
http://forums.asp.net/t/1127147.aspx

Multiple Update Panels not exactly asynchronous

Hi,

I'm having trouble getting a page with 2 update panels to update themselves asynchronously. It appears, the update inside of one update panel is canceled as soon as the other update panel begins an update.

I want to be able to click a button inside of an update panel. Then, while that panel is updating, click on another button inside of another update panel without canceling the first update.

Not sure if this makes sense or if it's possible, but below is some code demonstrating the issue. When you try to click both buttons, the update of the first button is cancelled.

1<%@dotnet.itags.org. Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>23<%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>4<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">5<html xmlns="http://www.w3.org/1999/xhtml">6<head runat="server">7 <title>Untitled Page</title>8</head>9<body>10 <form id="form1" runat="server">11 <asp:ScriptManager ID="ScriptManager1" runat="server" />12 <div>13 <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">14 <ContentTemplate>15 <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel1">16 <ProgressTemplate>17 Updating UpdatePanel1...18 </ProgressTemplate>19 </asp:UpdateProgress>20 <asp:Label ID="lblUpdate1" runat="server"></asp:Label>21 <asp:Button ID="btnUpdate1" runat="server" OnClick="Button1_Click" Text="Update 1" />22 </ContentTemplate>23 <Triggers>24 <asp:AsyncPostBackTrigger ControlID="btnUpdate1" EventName="Click" />25 </Triggers>26 </asp:UpdatePanel>27 </div>28 <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">29 <ContentTemplate>30 <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel2">31 <ProgressTemplate>32 Updating UpdatePanel2...33 </ProgressTemplate>34 </asp:UpdateProgress>35 <asp:Label ID="lblUpdate2" runat="server"></asp:Label>36 <asp:Button ID="btnUpdate2" runat="server" OnClick="btnUpdate2_Click" Text="Update 2" />37 </ContentTemplate>38 <Triggers>39 <asp:AsyncPostBackTrigger ControlID="btnUpdate2" EventName="Click" />40 </Triggers>41 </asp:UpdatePanel>42 </form>43</body>44</html>45

1using System;2using System.Data;3using System.Configuration;4using System.Web;5using System.Web.Security;6using System.Web.UI;7using System.Web.UI.WebControls;8using System.Web.UI.WebControls.WebParts;9using System.Web.UI.HtmlControls;10using System.Threading;1112public partialclass _Default : System.Web.UI.Page13{14protected void Page_Load(object sender, EventArgs e)15 {1617 }1819protected void Button1_Click(object sender, EventArgs e)20 {21 Thread.Sleep(5000);22 lblUpdate1.Text = DateTime.Now.ToString();23 }24protected void btnUpdate2_Click(object sender, EventArgs e)25 {26 Thread.Sleep(5000);27 lblUpdate2.Text = DateTime.Now.ToString();28 }29}

Take a look at this post:http://forums.asp.net/t/1117212.aspx and this one:http://forums.asp.net/t/1108522.aspx

Basically, you can only have 1 asynchronous request at a time with UpdatePanels.

-Damien


See the link it will solve your problem

http://forums.asp.net/t/1108522.aspx


Awesome. That works great for buttons.

Any idea how to do the same thing for other events? Like a GridView Sorting or SelectedIndexChanged event?


Checkout this posthttp://geekswithblogs.net/rashid/archive/2007/08/08/Asp.net-Ajax-UpdatePanel-Simultaneous-Update--A-Remedy.aspx


KaziManzurRashid:

Checkout this posthttp://geekswithblogs.net/rashid/archive/2007/08/08/Asp.net-Ajax-UpdatePanel-Simultaneous-Update--A-Remedy.aspx

Thanks Kazi. That works, but for some reason it does not work if I use a MasterPage. I've tried putting the scriptmanager in the masterpage and in the webform using that master page and it doesn't work either way. Any ideas why?

EDIT: BTW, It appears the _doPostBack() method of the prm instance is not working for elements inside of a masterpage. Not sure what I'm doing wrong.


I was able to fix my MasterPage problem by making the changes suggested by the 2 comments in the blog.

I also made the following change to the endRequest() function in order to support GridView postbacks:

1function endRequest(sender, args)2 {3 //Check if we have a pending call4 if (_callQueue.length > 0)5 {6 //Get the first item from the call queue and setting it7 //as current executing item8 _executingElement = Array.dequeue(_callQueue);9 var _element = _executingElement[0];10 var _eventArg = _executingElement[1];1112 //Now Post the from which will also fire the initializeRequest13 if(_element.name != null)14 _prm._doPostBack(_element.name, _eventArg);15 else16 _prm._doPostBack(_element.id.replace(/_/g,"$"), _eventArg);17 }18 }

So basically if the executingElement does not have a name set, I create it by replacing the '_' characters in the id with '$' characters (not sure if this is ok, but it's working).

My final problem: The UpdateProgress control is not displaying for the queued requests. Any idea how to make this work??

Thanks,

Fred

multiple update panels each with a timer

I have a very simple page. It has 1 script manager and 2 update panels. Each update panel has a label and a timer. the timers are set 1 second and each simply updates the label with the current time. The first timer works and displays the time. The second never fires. Any one have any ideas? Here is the page...

<%

@dotnet.itags.org.PageLanguage="C#"AutoEventWireup="true"CodeBehind="Default.aspx.cs"Inherits="WebApplication1._Default" %>

<%

@dotnet.itags.org.RegisterAssembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"Namespace="System.Web.UI"TagPrefix="asp" %>

<!

DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<

htmlxmlns="http://www.w3.org/1999/xhtml">

<

headrunat="server"><title>Untitled Page</title>

</

head>

<

body><formid="form1"runat="server"><div><asp:ScriptManagerID="ScriptManager1"runat="server"></asp:ScriptManager>

</div> <asp:UpdatePanelID="UpdatePanelFirst"runat="server"><ContentTemplate><asp:TimerID="TimerFirst"runat="server"Interval="1000"OnTick="TimerFirst_Tick"></asp:Timer><asp:LabelID="LabelFirst"runat="server"></asp:Label></ContentTemplate></asp:UpdatePanel><asp:UpdatePanelID="UpdatePanel1"runat="server"><ContentTemplate><asp:TimerID="Timer1"runat="server"Interval="1000"OnTick="Timer1_Tick"></asp:Timer><asp:LabelID="Label1"runat="server"Text="Label"></asp:Label></ContentTemplate></asp:UpdatePanel></form>

</

body>

</

html>

and the code behind.

using

System;

using

System.Data;

using

System.Configuration;

using

System.Collections;

using

System.Web;

using

System.Web.Security;

using

System.Web.UI;

using

System.Web.UI.WebControls;

using

System.Web.UI.WebControls.WebParts;

using

System.Web.UI.HtmlControls;

namespace

WebApplication1

{

publicpartialclass_Default : System.Web.UI.Page

{

protectedvoid Page_Load(object sender,EventArgs e)

{

}

protected

void Timer1_Tick(object sender,EventArgs e)

{

Label1.Text =

DateTime.Now.ToShortTimeString();

}

protectedvoid TimerFirst_Tick(object sender,EventArgs e)

{

LabelFirst.Text =

DateTime.Now.ToLongTimeString();

}

}

}

I am not sure about your requirement. If you are trying to update both the labels at the same time one timer will do.

But if you want both the Timer ticks to work modify your code as follows:

protected

void Timer1_Tick(object sender,EventArgs e)

{

Timer1.Enabled =

false;

Timer2.Enabled =

true;

Label1.Text = System.

DateTime.Now.ToLongTimeString();

}

protectedvoid Timer2_Tick(object sender,EventArgs e)

{

Timer2.Enabled =

false;

Timer1.Enabled =

true ;

Label2.Text = System.

DateTime.Now.ToLongTimeString();

}

Multiple Update Panels & Control Events

Thankfully i've been able to re-create this issue but i'm still not entirely sure why it happens as it does. I've created a page with two update panels, inside of each is a label and a button. Each label is set to the current date when the labels PreRender event fires. The first time this loads, each event fires at pretty much the same time. As expected if i press either of the buttons, both label PreRender events fire and update the corresponding label. However If i set the update mode to conditional on the updatepanel, both labels PreRender events fire but only the one which shares the update panel with the pressed button has the UI updated. In this trivial example thats not too much of a problem, however when I'm loading in a dataset in one of the panels, i dont want the data being re-loaded in each time a different update panel posts back. Thanks in advance, Matt Here's my trivial example HTML and C# c#
protected void Page_Load(object sender, EventArgs e) { }protected void Label1_PreRender(object sender, EventArgs e) { Label1.Text = DateTime.Now.ToString(); }protected void Label2_PreRender(object sender, EventArgs e) { Label2.Text = DateTime.Now.ToString(); }protected void Button2_Click(object sender, EventArgs e) { }protected void Button1_Click(object sender, EventArgs e) { }
<asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="Label2" runat="server" OnPreRender="Label2_PreRender" Text="Label"></asp:Label> <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Submit 2" /> </ContentTemplate> </asp:UpdatePanel> </div> <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="Label1" runat="server" OnPreRender="Label1_PreRender" Text="Label"></asp:Label> <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Submit One" /> </ContentTemplate> </asp:UpdatePanel>

This is by design. When you have multiple UpdatePanels and each set to Conditional, UI updates only occur in that particular UpdatePanel. You can get more info about UpdatePanels in the docs:http://www.asp.net/AJAX/Documentation/Live/tutorials/UpdatePanelTutorials.aspx

For updating a label like you are, I would utilize PageMethods vs. and UpdatePanel anyway. You can mix the two technologies if you need to. Seehttp://encosia.com/2007/07/11/why-aspnet-ajax-updatepanels-are-dangerous for an excellent example and more information.

-Damien