Treeview in modal dialog

I have a modal dialog extender that displays a panel when a button is clicked on the screen. There is a treeview in the panel that has 1...n nodes in it. The panel gets visible just fine, Ok and Cancel buttons work right, but I have a problem with the treeview. When I click on a node in the treeview, modal dialog dissapears from the screen. I've added the treeview to update panel but that didn't work, eighter. Does anyone have had this same problem?

Hello,

I believe treeviews have there own ajax like behaviors and you may be experiencing a postback when the node is clicked.

Can you try to set the property below on your treeview?

EnableClientScript ="False"

Also, is the treeview causing a postback whne you click it? If so, you may need to show the modal dialog extender again after the postback.

Good luck,

Louis

Trigger Animation

Like most of the ToolkitExtensions the AnimationExtension is connected to a TargetId, mostly a button.
But how could I trigger an animation in my codebehind. Say I check the text in a TextBox. How could I then start the animation. I triedRegisterStartupScript, but I can't get it right.

protectedvoid Button1_Click(object sender,EventArgs e)
{
if (TextBox1.Text == "")
{
//Show my animation
}
}

Seconded!!

Yes, god please, someone tell me how this is done.

Alternatively, tell us how to get the IDs of server controls into ConditionScript.

Hi Marinus/Mattias,

I think the best thing to do, as Mattias suggests, is to use theConditionAnimation. This will let you decide whether or not to play the animation by running a little bit of JavaScript. Assuming yourTextBox has anID="TextBox1" (and isn't in anaming container - but if it is, then itsClientID, which is the munged ID of your server control when written to the client, will look something likectl00_MyPanel1_TextBox1), you could define your animation as:
.
.
.
<Animations>
<OnClick>
<%-- Compared TextBox1.value to 2 single quote signs, not a double quote, to see if it's empty --%>
<Condition ConditionScript="$('TextBox1').value == ''">
.
. <%-- Original animation markup here --%>
.
</Condition>
</OnClick>
</Animations>
.
.
.

If you really do want to invoke the animation from the server, then you could emit code server side to interact with the Toolkit (as discussed inthis post) that will play the animation (as discussedhere - and each animation, likeOnClick,OnMouseOver, etc., has it's own function you can call to invoke it). If this doesn't answer your question, please keep posting.

Thanks,
Ted

Thanks for your answer Ted, I will read the posts and try it out.

Ted,
In the post about the ModalPopupExtender you wrote:
"Again, we're looking at making this a LOT easier with updates in our next release."
And yes, in the next release of the toolkit it was much easier. Now you just could write in your code behind:

ModalPopupProperties popup = MyModalExtender.GetTargetProperties(Target);
popup.Show();

Great!
Does the AnimationExtender has something alike?

Hi Marinus,

TheAnimationExtender doesn't have support for playing animations from the server (mostly because they're meant to be triggered from the client and it's a little weird to suggest that while the page was posting back your mouse hovered over a certain control). Another route you might look into iscreating the OnLoad animation on the server because that will automatically play once you post back.

Thanks,
Ted

Hi Ted,

I'm not 100% sure I understand your answer. Will the code below work if the TextBox is in a naming container (and therefore has that long munged ClientID) or not? If not, how do I make it work, because TextBoxes are almost always in naming containers in any reasonably complex application. I havent figured out how the heck to get the ClientID into theConditionScriptattribute of theConditiontag.

/Mattias

Ted Glaza [MSFT]:

Hi Marinus/Mattias,

I think the best thing to do, as Mattias suggests, is to use theConditionAnimation. This will let you decide whether or not to play the animation by running a little bit of JavaScript. Assuming yourTextBox has anID="TextBox1" (and isn't in anaming container - but if it is, then itsClientID, which is the munged ID of your server control when written to the client, will look something likectl00_MyPanel1_TextBox1), you could define your animation as:
.
.
.
<Animations>
<OnClick>
<%-- Compared TextBox1.value to 2 single quote signs, not a double quote, to see if it's empty --%>
<Condition ConditionScript="$('TextBox1').value == ''">
.
. <%-- Original animation markup here --%>
.
</Condition>
</OnClick>
</Animations>
.
.
.

If you really do want to invoke the animation from the server, then you could emit code server side to interact with the Toolkit (as discussed inthis post) that will play the animation (as discussedhere - and each animation, likeOnClick,OnMouseOver, etc., has it's own function you can call to invoke it). If this doesn't answer your question, please keep posting.

Thanks,
Ted

Hi Mattias,

No, the code example you were quoting wouldn't work if you had aTextBox in anINamingContainer. We'd like to make some improvements for scenarios like this in the future, but for now there is a workaround available. You can programatically modify the animations on the server like this:

<%@. Page Language="C#" %>
<%@. Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="atlasToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
 protected override void OnLoad(EventArgs e)
 {
 base.OnLoad(e);
 // Set the ConditionScript property of the OnClick Animation
 MyAnimations.OnClick.Properties["ConditionScript"] = string.Format("( $('{0}').value == '' )", txtName.ClientID);
 // Set the AnimationTarget property of the OnClick Animation's first child
 MyAnimations.OnClick.Children[0].Properties["AnimationTarget"] = txtName.ClientID;
 }
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server"><title>Test Page</title></head>
<body><form runat="server"><div>
 <atlas:ScriptManager id="ScriptManager" runat="server" />
 Name: <asp:TextBox ID="txtName" runat="server" /><br />
 <asp:Button ID="btnValidate" runat="server" Text="Animate If Empty" OnClientClick="return false;" /
 <atlasToolkit:AnimationExtender ID="MyExtender" runat="server">
 <atlasToolkit:AnimationProperties ID="MyAnimations" TargetControlID="btnValidate">
 <Animations>
 <OnClick>
 <Condition ConditionScript="/* To be filled in by the server - we'll default to false */ false">
 <Color Duration="1" StartValue="#FFFFFF" EndValue="#FF0000"
 Property="style" PropertyKey="backgroundColor" />
 </Condition>
 </OnClick>
 </Animations>
 </atlasToolkit:AnimationProperties>
 </atlasToolkit:AnimationExtender>
</div></form></body>
</html>

Thanks,
Ted

Trigger control outside the updatepanel

Hello,

I need that the control typed in the "ControlID" property of a trigger, to be outside of the updatepanel.

If I put the button inside of the updatepanel, atlas works correctly.

But if I put the button outside of the updatepanel, the button_Click event is doing a complete postback of the entire page.

I want to put the button outside, because i don't want to load the same button one more time, just want to refresh the updatepanel when this button is clicked.

I hope you can understand. You can note my english is not very well.

Thanks!

You can make the button_Click handler call the UpdatePanelName.Update() function to make a partial postback on updatepanel UpdatePanelName. I hope this helps!
I had a similar requirement and used updatepanels inside a main updatepanel.

Thanks for your answers.

I've tried the UpdatePanel.Update() method, but still refreshing the entire page.

I've tried too somethinglike this:

<cc1:UpdatePanel ID="PanelFotoGrande" runat="server" Mode="Conditional"><ContentTemplate> ...Big Foto...</ContentTemplate><Triggers> <cc1:ControlEventTrigger ControlID="rptMiniaturas" EventName="ItemCommand" /></Triggers></cc1:UpdatePanel><cc1:UpdatePanel ID="PanelMiniaturas" runat="server" Mode="Conditional"><ContentTemplate> ...Thumbnails...</ContentTemplate></cc1:UpdatePanel>

With the same result. Finally, i've tried to group the two update panels inside other one. But still updating both updatepanels.

Maybe i have to disable the autopostbak fired by the button?? I don't know how..

Thanks a lot.

Trigger does not work

I have a trigger, which is set to lblProgress.Text property. Once the user clicks the button, the code changes the property, but nothing is displayed untill the onclick event finish. Should not be the Atlas asynchronous?

Default.aspx:

<%

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

<!

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

<

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

<

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

</

head>

<

body><formid="form1"runat="server"><atlas:ScriptManagerID="scriptManager"EnablePartialRendering="true"runat="server"/>

<atlas:UpdatePanelID="UpdatePanel1"Mode="Conditional"runat="server"><ContentTemplate><asp:ButtonID="btnImport"runat="server"Text="Import"OnClick="btnImport_Click"/><divstyle="background-color:Lime"><h1><asp:LabelID="lblProgress"runat="server"Text=""></asp:Label></h1></div></ContentTemplate><Triggers><atlas:ControlValueTriggerControlID="lblProgress"PropertyName="Text"/></Triggers></atlas:UpdatePanel></form>

</

body>

</

html>

Deafault.aspx.cs

using

System;

using

System.Data;

using

System.Configuration;

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;

public

partialclass_Default : System.Web.UI.Page

{

protectedvoid Page_Load(object sender,EventArgs e)

{

}

protectedvoid btnImport_Click(object sender,EventArgs e)

{

lblProgress.Text =

"Starting Import...";

System.Threading.

Thread.Sleep(5000);

lblProgress.Text =

"That took awhile...";

}

}

I suspect any of two:

1) Call to button_Onclick is not asynchronous, so the page is waiting for the sub to finish

or

2) Setting lblProgress.Text from code does not trigger the trigger.. That would mean a bug in Atlas I guess

Wonder what you think...

Hi,

Atlas being asynchronous means that when you trigger an update for an UpdatePanel, a HTTP request is sent asynchronously to the web server, i.e. you can do other processing on client-side while the request you sent is being processed and the corresponding response is generated.

But the above response is generated when the partial postback ends, i.e. when the page has completed its whole lifecycle and rendered the HTML for the controls inside the UpdatePanel. This means that when btnImport_Click returns, the Label's text is set to "That took awhile..." and it's this text that will be displayed, since it is this text that it is rendered by the Label control and sent in the response from the server.

OK, sounds logical.How do I make the label to refresh in my long running process, which is executed after click?

I have also noticed that UpdatePanel has update property, but not sure how to use it...

Hi,

there are many approaches to monitor a long running task. The one I would take is to spawn a separate thread to run the task (btw checkthis article) and then poll the server at a specified interval to check the task's status and update a progress bar or other kind of progress indicator.

Without Atlas, this could be done using pure Javascript or a meta refresh. Adding Atlas would probably mean using a Timer control to just send the polling requests asynchronously, and update some controls (the progress indicators) inside an UpdatePanel.

Thanks, I was hoping that this could be done simpler using Atlas, if I could only somehow force the UpdatePanel to refresh itself once the lblProgress.text property is updated, my initial thought was that the trigger would do it, but than reading your post I realized that it is waiting for the btnImport_OnClick sub to finish...

Maybe if I need to have btnImport_OnClick running in seperate thread?

You said:

"...But the above response is generated when the partial postback ends, i.e. when the page has completed its whole lifecycle and rendered the HTML for the controls inside the UpdatePanel. This means that when btnImport_Click returns, the Label's text is set to "That took awhile..." and it's this text that will be displayed, since it is this text that it is rendered by the Label control and sent in the response from the server..."

Can I render page early in my onlick sub? before onclick sub will finish?How would I execute UpdatePanel partial postback once my onlick sub sets the lplProgress.text property?

Hi,

rfurdzik:

Can I render page early in my onlick sub? before onclick sub will finish?

no, because the rendering of a page is a stage in its lifecycle and you cannot modify the Page's lifecycle.

rfurdzik:

How would I execute UpdatePanel partial postback once my onlick sub sets the lplProgress.text property?

A partial postback is just a postback performed asynchronously (i.e. using XMLHTTP). From the Page's lifecycle point of view, a classic postback and a partial postback are pretty much the same thing: the Page goes through all its whole lifecycle, like in a "regular" postback. The difference is that only the HTML of the controls inside the UpdatePanels that are updating is injected into the response.

Also what is the porpouse of UpdatePanel1.Update(); ?

Does it force UpdatePanel to do partial postback?

I have also found this interesting article:http://forums.asp.net/thread/1338483.aspx

Seems that he found a way around to execute partial postback... Wonder how would it be possible to execute partial postback in my code:

protectedvoid btnImport_Click(object sender,EventArgs e)

{

lblProgress.Text =

"Starting Import...";

//Here I would like to execute partial postback of Updatepanel1. I have tried UpdatePanel.Update(), but it did not work

System.Threading.

Thread.Sleep(5000);

//THIS LAST MESSAGE IS ONLY SHOWN

lblProgress.Text =

"That took awhile...";

}

<<A partial postback is just a postback performed asynchronously (i.e. using XMLHTTP). From <<the Page's lifecycle point of view, a classic postback and a partial postback are pretty much <<the same thing: the Page goes through all its whole lifecycle, like in a "regular" postback. The <<difference is that only the HTML of the controls inside the UpdatePanels that are updating is <<injected into the response.

I think I understand now, so the page lifecycle will be finished when the last line of the OnClick sub is executed. Is this correct? In this case I guess I need:

1) to have Onclick to instantiate a seperate thread for long running task and leave the task running.. (what happens if the user closes the browser?)

2) My import class calls delegate method (part of my page, setup in import class constructor),how could I make that delegate method to update the lblProgress.text and execute partial postback?

Do you think that using webservice would make more sense?

After doing some research I realized that you were right,btnClick_ONClick sub is part of Postback, that is why postback request can not be generated within.

So now the question would be which aproach to use?

1) The one suggested by you btnClick_ONClick sub would create a seperate thread. Seems like it should be OK to execute Postback from a seperate thread process...

2) Create control in Atlas and have the control to call webservice. Seems like only the control can update progress label settings, server side code can not...

What would be the cons and prons of eighter aproach?

Instead of worrying about creating a new thread, you could separate the single request into 3 separate requests. The initial button click would cause the UpdatePanel to postback where you can change the text to 'loading', and use RegisterClientScriptBlock to inject javascript which would then initiate a second postback. The second postback would then perform your long operation, and would use RegisterClientScriptBlock to inject javascript to fire the final request which would be responsible for changing your text to 'finished' or whatever you decide.

Hope this helps,
-Tony

That is a great idea! I did not think about it. Would this technique allow the text to change several times during the Long Running Process? For example (1,2,3% etc..)

What is the exact injected java script/atlas code to fire the LRP sub? I do not know java script too much... Do you think that that javascript could call asynchronous web method, which would perform LRP and update the label's text? Will the web method have access to the Page object? Thanks,

Rafal

<< and then poll the server at a specified interval to check the task's status

Is not that waste of resources? I was thinking to have the LRP (Long Running Process) to call page's method (via delegate) and force the page to postback itself (partial postback).

What do you think?

Trigger inside user control wont work

My Page contains a DataGrid inside UpdatePanel and a Filter user control.
I want to set a trigger to the UpdatePanel which refer to a button inside the Filter user control.

I get this error:
A control with ID 'Filter1_btnGo1' could not be found for the trigger in UpdatePanel 'UpdatePanel'.

how do I make this work?

Have you tried:

UpdatePanel.FindControl()

You pass in the control ID.

If you still have a problem, supply some sample code and I'll have another look.

Here is a small and simple code example to show the problem, have a look ...

1. TestUpdatePanel.aspx

<%@. Page Language="C#" AutoEventWireup="true" CodeBehind="TestUpdatePanel.aspx.cs" Inherits="Test.TestUpdatePanel" %>
<%@. Register TagPrefix="UC" TagName="OutSideTrigger" src="http://pics.10026.com/?src=MyUserControl.ascx" %>

<script runat="server">

protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "Refreshed at " +
DateTime.Now.ToString();
}
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>UpdatePanel Tutorial</title>
<style type="text/css">
#UpdatePanel1 {
width:300px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label1" runat="server" Text="Panel created."></asp:Label><br />
</fieldset>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn1" />
<asp:AsyncPostBackTrigger ControlID="uc1_UCButton" />
</Triggers>
</asp:UpdatePanel>
<asp:Button ID="btn1" runat="server" OnClick="Button1_Click" Text="Button" /></div>
<UC:OutSideTrigger id="uc1" runat="server"></UC:OutSideTrigger>

</form>
</body>
</html>

2. MyUserControl.ascx

<%@. Control Language="C#" AutoEventWireup="true" CodeBehind="MyUserControl.ascx.cs" Inherits="Test.MyUserControl" %>

<div style="height:50;width:400;background-color=yellow">
<asp:Button ID="UCButton" runat="server" Text="Button should triger the update panel." />
</div>

Trigger on onmouseover

I have an updatepanel with a button and a panel inside. If I hold the mouse over the button I want to update the panel with some information from a database. I can't find out how to trigger on a onmouseover-event, is this possible?

Thanks for your help!

You're probably going to be unhappy with the performance, doing it that way, but you can just a an onmouseover attribute to the button. In the onmouseover handler, you could either call button.click() oruse __doPostBack() to trigger the partial postback.

It seem to work. Thank you for the tip!

I also want my updatepanel to fade in when I hold the mouse over a button and to fadeout on mouseout, is this possible to do with the animations in AjaxControlToolkit?

Thanks for your help!

Yes, the Animations in the Toolkit can do that. Personally, I find jQuery a lot easier to use for animation though. You might want to check that out also.

So the toolkit can do it? I have been trying to do this all day but can't find out how! Do you have an example on how to do it? It would be great!

Thanks again for your help!

Take a look at the Animation documentation: http://www.asp.net/AJAX/AjaxControlToolkit/Samples/Animation/Animation.aspx

You can see the basic syntax of setting up the onmouseover and onmouseout animations in the properties section of that page, at the bottom.

Trigger Update Panel from button on different ContentPanel

I have a master page with two contet panels: cntSearch and cntBody. The cntSearch panel has a search form and a button (btnSubmit), the cntBody panel, among other things, has an Update Panel which contains a gridview (grdMain). I am trying to set up a trigger between the submit button in the cntSearch panel and the gridview in the cntBody. Visual Studio 2005 IDE allows me to pick btnSubmit and its Click() event from the list of possible controls when I go and add a Trigger to the Update Panel. However, when I try to load the page I get an error indicating that "A control with ID "btnSubmit" could not be found for the trigger in UpdatePanel..."

When I move the button from the cntSearch Content Panel inside the cntBody Content Panel, the page loads fine. Is there a special way I need to reference the button's ID in the Trigger section of the Update Panel so that it can find it?

Thanks,

Jaime

Here is a simplified version of my code:

<%

@.PageLanguage="VB"MasterPageFile="~/Master.master"AutoEventWireup="false"CodeFile="test.aspx.vb"Inherits="test"title="Untitled Page" %>

<

asp:ContentID="ctSearch"ContentPlaceHolderID="cphSearch"Runat="Server"><asp:ButtonID="btnSearch"runat="server"Text="Search"/>

</

asp:Content>

<

asp:ContentID="ctBody"ContentPlaceHolderID="cphBody"Runat="Server"><asp:UpdatePanelid="upMain"runat="server"><contenttemplate><asp:GridViewid="grdGrid"runat="server"></asp:GridView></contenttemplate><triggers><asp:AsyncPostBackTriggerControlID="btnSearch"EventName="Click"></asp:AsyncPostBackTrigger></triggers></asp:UpdatePanel>

</

asp:Content>

Thanks,

Jaime

This is from my another post:

I have solved my problem by doing the following..

Iwrapped my 2 content areas in the master page in a update panel.Basically I put the content panes inside an update panel in the masterpage. Now on my other page, if I click on a button in one content area,both the contents get updated without the page being refreshed.

Thanks

Thanks for the reply marathi. I tried your suggesting and it did not work, I am still getting the error indicating that the submit button can not be found.

Jaime

Can you post your source here. I shall look into it, it works fine for me.

Thanks to marathi for putting me on the right track since no final post was here I thought I would add my derived solution. Basically if you place the UpdatePanel control in the master page and aroundboth content panels you can still place the Trigger in the child page where the triggering control is defined. My own use was to have a calendar in the first content section change the content in the second content frame (a custom control) and it works great.

In your master page: 

<asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:ContentPlaceHolder ID="cntSearch" runat="server"></asp:ContentPlaceHolder><asp:ContentPlaceHolder ID="cntBody" runat="server"></asp:ContentPlaceHolder> </ContentTemplate></asp:UpdatePanel>

 In your child page:

  
<asp:Content ID="cntSearchContent" ContentPlaceHolderID="cntSearch" runat="server"><asp:TextBox runat="server" ID="SearchText"></asp:TextBox> <asp:Button ID="SearchButton" runat="server" Text="Search" /></asp:Content><asp:Content ID="cntBodyContent" ContentPlaceHolderID="cntBody" runat="server"> <asp:GridView ID="GridView1" runat="server"></asp:GridView><Triggers><asp:AsyncPostBackTrigger ControlID="SearchButton" EventName="Click" /></Triggers> </asp:Content>
 

Trigger UpdatePanel with javascript

I have a GridView inside an UpdatePanel. Also on the page is a button, that when the user clicks opens up a modal dialog box. After the user selects an item from the dialog box, the dialog closes which triggers a javascript function. The purpose of this javascript function is to re-bind the GridView, thereby displaying the item just selected from the dialog box.

The javascript function simply triggers a hidden linkbutton that also resides inside the UpdatePanel.

The javascript code:

document.getElementById('ctl00_Main_LinkButton1').click();

The LinkButton code:

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

GridView1.DataBind()

EndSub

This all works fine under IE6. The problem just started when I upgraded to IE7. The LinkButton is no longer getting triggered, so the GridView doesn't update. I've tried this with both the Atlas release, and the Ajax Beta 2 release. Neither seems to do what I want with IE7.

One other thing, if I remove the UpdatePanel from the page entirely, and force a full page refresh, it works fine with IE7.

Has anyone else noticed this? Any ideas on a work around?

hello.

try using fiddler to see the error you're getting.

I downloaded and ran Fiddler, but can see no errors.

I have many apps that use the similar method, and it works in IE6, IE7 and Firefox v2.0 and Apple Browser (don't remember the name - Safari?) hmmm who cares.

Try put your LinkButton outside the update panel.

WS

p.s: my apps use button instead link button. AND I don't use modal window, because it's not supported by many browsers. Instead, I use floating div. Good Luck.

I think the key difference with your solution is that all the logic resides in one page (with the use of floating div). I have tried adding a linkbutton outside the updatepanel, but this makes no difference in my solution.

With the modal dialog, I can trigger the javascript function when the dialog is closed. I tested this my triggering an Alert from my javascript function, so I know the function is being called when I close the dialog.

I next tried adding an HTML Input button outside the updatepanel:

<inputid="Button1"type="button"value="button"onclick="javascript:document.getElementById('LinkButton1').click();"/>

When I clicked this button, itdid trigger a refresh. I'm just not sure why it won't do it automatically once the dialog box is closed. Again, I've proven that the function is being called when the dialog is closed. I'm wondering if this isn't some IE 7 security issue. I've played around with the permissions a bit, but still have no joy.

For what it's worth,

I finally found a solution to my problem. I did a little digging into the JS file for the AJAX ModalPopup control, and modified my javascript accordingly:

window.setTimeout(

"document.getElementById('ctl00_Main_LinkButton1').click();", 0);

Now works with both IE6 and IE7.

Thanks to all for your responses.

Trigger UpdatePanel using Javascript

Hi everyone, I'm trying to refresh an updatepanel using javascript.

What I did worked out, I put a hidden button inside my panel and set it as a trigger then called mybutton.click() in the javascript. The problem is that this doesn't work with firefox, a full postback happens when my function is called. Anyone know a work around that works fine in IE and firefox?

Thank you.

http://weblogs.asp.net/rajbk/archive/2007/01/21/refresh-updatepanel-via-javascript.aspx

Do you mind telling us what scenario you are using this in?

hello.

the strategy you're using seems to be correct. can you post some demo code?

Thank you for the replies, what i'm doing is I have a modalpopup on my page where a user uploads photos, then when the modalpopup is closed, I have the OnOkScript call the button click event and update my updatepanel which contains thumbnails of images, so when a person uploads a photo using the modalpopup, then closes it, the photo they added shows up on the list of thumbnails.

Here is a code sample...(i'm using a label not photos for testing now)

My Code Behind:

protectedvoid btnRefreshThumbnails_Click(object sender,EventArgs e)

{

lblTest.Text =

"event fired";

}

Javascript:

function

refreshImages()

{

document.getElementById(

'<%= btnRefreshThumbnails.ClientID %>').click();

}

Page Code:

<

asp:UpdatePanelrunat="server"id="upThumbnails"UpdateMode="Conditional">

<

ContentTemplate>

<asp:Labelrunat="server"Text="Label"id="lblTest"></asp:Label><asp:Buttonrunat="server"Text="abc"id="btnRefreshThumbnails"CausesValidation="false"OnClick="btnRefreshThumbnails_Click"style="display:none;"></asp:Button></ContentTemplate><Triggers><asp:AsyncPostBackTriggerControlID="btnRefreshThumbnails"EventName="Click"></asp:AsyncPostBackTrigger></Triggers>

</

asp:UpdatePanel><cc1:ModalPopupExtenderID="ModalPopupExtenderUploader"runat="server"OkControlID="imgBtnClose"DropShadow="false"TargetControlID="btnUploadPhotos"PopupControlID="pnlUploader"OnOkScript="refreshImages() "BackgroundCssClass="bg">

</cc1:ModalPopupExtender>

I'm going to give the hidden field method a shot to see if it works well in firefox...Thanks.

The hidden field worked!! Maybe firefox just always posts back when you call the click() method.

Thank you for all the help.

hello.

hum...well, this code is working ok here:

<%@. 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">
<div>
<asp:ScriptManager runat="server" id="manager" />
<asp:UpdatePanel runat="server" id="panel">
<ContentTemplate>
<%= DateTime.Now.ToString() %>
<asp:Button runat="server" id="bt" style="display: none" />
<input type="button" value="partial postback" onclick="$get('bt').click()" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html

Hire is my solution, that works in IE, FF, Opera:

<script type="text/javascript">function updateTime(param) { var hiddenField = document.getElementById("<%=hidCurrentFileId.ClientID%>"); hiddenField.value = param; __doPostBack('<%=hidCurrentFileId.ClientID%>','');}</script><asp:HiddenField ID="hidCurrentFileId" runat="server" Value="" /><asp:UpdatePanel ID="updPanel" UpdateMode="Conditional" runat="server"> <Triggers> <asp:AsyncPostBackTrigger ControlID="hidCurrentFileId" EventName="ValueChanged" /> </Triggers> <ContentTemplate><%= hidCurrentFileId.Value%> <br/><%= DateTime.Now.ToString();%> </ContentTemplate></asp:UpdatePanel>

Hello, I have two questions about the above code:

1) How do you capture this event on the server?

2) If the "ValueChange" of the hidden field causes the updatepanel to post back, doesn't the "__doPostBack('<%=hidCurrentFieldID.ClientID%>',''); cause the ENTIRE PAGE to postback?

Trying to do the above from user controls doesn't work, but I got the above code working with some changes.

1) Added a 'return false;' after the __doPostBack...this stopped the full page postback

2) I placed the hidden field INSIDE the update panel and set a trigger with an OnValueChanged="myCodeBehindFunction"

3) In the code behind I retrieve the parameter passed in using:

Dim myArgumentAsString = Request.Params.Get("__EVENTARGUMENT")

4) I set the clientID in the preRender

The full code is:

ASPX...

<scripttype="text/javascript">function test1(node, eventArgs) {var hiddenField = document.getElementById('<%= hiddenFieldID %>');

hiddenField.value = node.Text;

__doPostBack(

'<%= hiddenFieldID %>',node.ID);returnfalse;

}

</script>

<asp:UpdatePanelID="updPanel"UpdateMode="Conditional"runat="server"><ContentTemplate>

<asp:HiddenFieldID="tbTrigger1"runat="server"OnValueChanged="handleNodeClick"/><asp:LabelID="lblNode"runat="Server"></asp:Label><br/>

<%

=DateTime.Now.ToString()%></ContentTemplate></asp:UpdatePanel>

------------------

Public hiddenFieldIDAsString =""

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

Try

Dim myArgumentAsString = Request.Params.Get("__EVENTARGUMENT")Dim tempLBLAs Label =CType(Me.FindControl("lblNode"), Label)

tempLBL.Text = myArgument

Catch exAs ExceptionEndTryEndSubProtectedSub Page_PreRender(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.PreRenderTryDim tempHFAs HiddenField =CType(Me.FindControl("tbTrigger1"), HiddenField)IfNot tempHFIsNothingThen hiddenFieldID = tempHF.ClientIDCatch exAs ExceptionEndTryEndSub

I ran into the same problem and after searching I found the answer via a response Garbin gave someone on this thread.

http://forums.asp.net/thread/1275541.aspx

Adding the UseSubmitBehavior="false" then allowed the click() of the hidden button in javascript to work.

Try the extender control I build

http://daron.yondem.com

Triggering a Partial Postback with a Button Inside a Repeater

Hi All,

I have a Button inside a Repeater inside an Updatepanel and I would like to trigger the update of another updatepanel. The strategy I have utilized thus far is to add a commandname parameter to the button, passing it to the itemcommand parameter of the repeater. I then add a asyncpostback trigger for the 2nd updatepanel for repeater.itemcommand. The code that I have for the itemcommand executes, but the problem is I get a full page refresh. If anyone has a work around for this problem or know of a way to do something similar using a different strategy, I would greatly appreciate your help =) Thanks in advance!

I would also like to add that I have tried this with the repeater outside of the updatepanel and it still does not work.
While we work closely with the ASP.NET AJAX team when developing the Toolkit, they're the real experts on general ASP.NET AJAX issues. Your problem doesn't seem to be directly related to the Toolkit, so we'd appreciate if you considered posting to one of theother newsgroups such asAJAX Discussion and Suggestions. Your post will be more helpful to others looking for similar advice if it's in the right place. Thank you!

Triggering full page postback from control inside updatepanel.

Hi,

I was wondering if it was possible for a control inside an updatepanel to cause a full page postback.

I have a button in an updatepanel that when pressed, modifies some controls outside of the updatepanel. I need the page to do a full postback so that the rest of the controls are updated when the button is clicked. I can't put those other controls in another updatepanel, because one of those controls is a treeview.

Should I just remove the update panel, or is there a programmatical way to cause a full postback ?

Thanks in advance, Max

Try this:

<asp:UpdatePanel ID="UpdatePanel1" runat="server"> <Triggers> <asp:PostBackTrigger ControlID="Button2" /> </Triggers> <ContentTemplate> <asp:Button ID="Button1" runat="server" Text="Click me for an async postback." /> <asp:Button ID="Button2" runat="server" Text="Click me for a full postback." /> </ContentTemplate></asp:UpdatePanel>

And I was wondering what the postbacktrigger's where for !.

Thanks

And I was wondering what the postbacktrigger's where for !.

Thanks

Triggering PopupControlExtender from button click

I've got a simple scenario: I'm using a text box with a PopupControlExtender to display a calendar. Works great, but not the most intuitive way to bring up the calendar. I'd like to add an image button to the right of the text box that could ALSO trigger the opening of the calendar, in addition to the normal click on the text box.

I've tried using a call to this as the OnClientClick property, but nothing happens:

function OnButtonClick(){ var behavior = $find('pce'); behavior.showPopup();}

I'd appreciate any assistance on what seems like itshould beso obvious!

-- Jim --

what about using the AJAX toolkit's built-in calendar extender?

Triggering UpdatePanel with controls inside TabPanel

I have a TabContainer with several TabPanels inside, and several of the TabPanels contain Button controls.

<ajaxToolkit:TabContainer ID="InstructionTabs" runat="server" Height="300px">
<ajaxToolkit:TabPanel ID="XLSInstructions" runat="server" HeaderText="Excel">
<ContentTemplate>
<asp:Button ID="btnSubmit" runat="server" OnClick="btnSubmit_Click" Text="Submit" />
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>

Elsewhere on the page, I have an UpdatePanel (not contained inside theTabContainer or TabPanels), and I want to trigger this UpdatePanelusing one of the controls inside the TabPanels.

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
...
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSubmit" />
</Triggers>
</asp:UpdatePanel>

When I hardcode the Trigger, i get an error:

A control with ID 'btnSubmit' could not be found for the trigger in UpdatePanel 'UpdatePanel1'.

Also, using the designer to set the Triggers collection on he UpdatePanel, none of the controls inside the TabPanels are visible, just the TabContainer control itself. Any ideas how to get the UpdatePanel to trigger off a control in a TabPanel?

What you can do is, trigger your UpdatePanel with a javascript function or call UpdatePanel1.Update() inside your btnSubmit_Click() function.

triggers for programmatically added controls

Hi!

I almos get crazy in here :-)

I have a Button and an UpdatePanel with a table in it. When the Button is pressed, the UpdatePanel fills up with MANY programmatically auto generated LinkButtons:

example:

void mybutton_Click(object sender, EventArgs e)

 {
 LinkButton mylinkbutton =new LinkButton();
 mylinkbutton.Text ="hallo";
 mylinkbutton.ID ="mylinkbutton";
 mylinkbutton.Click +=new EventHandler(mylinkbutton_Click);
 mycell.Controls.Add(mylinkbutton);
 }

where mycell is part of the Updatepanel and mybutton is a AsyncPostBackTrigger of the UpdatePanel.

The problem is the EventHandler of the several link buttons (mylinkbutton_Click). The Event doesnt get fired.

I already tried tons of solutions like

ScriptManager.RegisterAsyncPostBackControl(mylinkbutton);

within the mybutton_Click. Didnt work...

This page (http://ajax.asp.net/docs/tutorials/UsingUpdatePanelControls.aspx) tells me that I have to place the .RegisterAsynPostBackControl in the Page_Load() function, but how should I do this at runtime?

Any ideas? need help!

TIA

J

Try this:

ScriptManager.GetCurrent(Page).RegisterAsyncPostBackControl(mylinkbutton)

Thanks a lot, but I already tried that!

I use a usercontrol and therefore call the postbackcontrol like that:

ScriptManager.GetCurrent(Parent.Page).RegisterAsyncPostBackControl(mylinkbutton);

But it still doesnt work :(

i do it like that:

void mybutton_Click(object sender, EventArgs e) { LinkButton mylinkbutton =new LinkButton(); mylinkbutton.Text ="hallo"; mylinkbutton.ID ="mylinkbutton"; mylinkbutton.Click +=new EventHandler(mylinkbutton_Click); mycell.Controls.Add(mylinkbutton); ScriptManager mymanager = ScriptManager.GetCurrent(Parent.Page); mymanager.RegisterAsyncPostBackControl(mylinkbutton); }

Microsoft says that I should call RegisterAsyncPostBackControl() in Page_Load() but I cannot write it there because I dont know my LinkButtons at design time! :-(

any ideas?

thx Joe

Hi,

like every dynamic controls, your LinkButtons must be recreated on every postback (either synchronous or asynchronous).

When you click one of the dynamic LinkButtons, you fire an asynchronous postback but the corresponding control doesn't exist on the server side, because you've created it in a handler (mybutton_Click) that now doesn't get called.

Two-way data binding problem with Atlas UpdatePanel

I have an existing ASP 2.0 page which utilizes a SQLDataSouce and a FormView with bound controls. The page has a "save" button which saves the contents of the bound controls to the database. It works fine when not using Atlas.

One of the textboxes on the form is a date field. I want to use Atlas and the .Net Calendar control to provide a popup calendar. I implemented the calander based upon some simple example code I found in the Atlas tutorial. The popup works great and the value from the calendar is correctly placed into the target textbox.

The problem I am having is that wrapping the UpdatePanel around the textbox causes it to lose two-way databinding.It correctly displays the initial value from the current database record but, when attempting to do and update the value is always NULL. Does anyone know what I may be missing. Below is the Atlas markup wrapped around the textbox:

Thanks,

Tony

<atlas:updatepanel id="upCallReportDateTime" runat="server" mode="Conditional" rendermode="Inline"
<triggers>
<atlas:controleventtrigger controlid="calDatePicker" eventname="SelectionChanged" />
</triggers>

<contenttemplate>
<asp:textbox id="txtCallReportDateTime" runat="server"
Width="150px"
Text='<%# Bind("CallReportDateTime") %>'
CssClass="EditTextBox"
ontextchanged="txtCallReportDateTime_TextChanged"
autopostback="true"/>
<asp:imagebutton id="cmdPickDate_CallReportDateTime" runat="server"
onclick="cmdPickDate_CallReportDateTime_Click"
imageurl="graphics/calendar.gif"
height="20px"
width="20px"
CausesValidation="false" />
</contenttemplate>
</atlas:updatepanel>

Were you ever able to solve this problem? I am having the exact same problem.

The only way I've solved it so far is to add the missing parameter in the FormView_ItemInserting event.

This works well but it seems like I shouldn't have to do that.