Update UpdatePanel using JavaScript

Hi Everybody,

i want to load dynamically content from some user controls (with forms,or some data-controls) using atlas. So i use an UpdatePanel for loadingthe user control into a placeholder.

Using buttons for loading new content works fine. But i still want touse a function which is callable per javascript. I think this way ismore flexable than using the Buttons, becaus every button needs it'sown Sub-Routine. But i want to have a function with an Parameter forloading the new content.

Has anybody a good idea how to realize this? Working with Update()-Function of UpdatePanel-Control doesn't logically work.

Here is some code:

At first my test-function

1 <WebMethod()> _
2Public Function Test(ByVal intIdAs String)As Boolean
3 Dim contentNameAs String = intId &".ascx"
4Dim contentControlAs Control = Page.LoadControl(contentName)
5
6 PlaceHolder.Controls.Add(contentControl)
7
8 UpdatePanel.Update()
9Return True
10 End Function

I called this per JS-Function ...

1function test(intId) {
2 PageMethods.Test(intId);
3}

... per onClick-Method of a Link

1<a href="#" onclick="test(1);">Test</a>
2
3 <atlas:UpdatePanel ID="UpdatePanel" runat="server">
4 <ContentTemplate>
5 <asp:PlaceHolder ID="PlaceHolder" runat="server">
6 </asp:PlaceHolder>
7 </ContentTemplate>
8 <Triggers>
9 <atlas:ControlEventTrigger ControlID="Button1" EventName="Click" />
10 <atlas:ControlEventTrigger ControlID="Button2" EventName="Click" />
11 </Triggers>
12 </atlas:UpdatePanel>

But it doesn't work. I have tried so much.

Is there a possibilty to get User Controls generated HTML Code?
Or has anybody an idea for realizing this with an other way?

Thanks for all hints.

Regards,

AndréHi Andre,

The main problem with what you are attempting to do is that you are attempting to make a modification to the page without actually performing a postback. Executing the web service method "Test" from Atlas using the PageMethod.Test statement will execute your web method, but doesn't actually perform a postback and therefore you can't modify your page. The web method can really only return data, not have ASP.NET re-render part of the page.

A simple, but maybe not the best way of accomplishing this, is to use a hidden text field and a button to provide postback data. You set the value of the hidden text box to the data needed to create the user control (i.e. intId) and then click the button programmatically (i.e. button1.click). Then you have a common routine on the server, like your web method "test", that alters the page as necessary based upon the postback information.

HTH
Hi,

thank you. But isn't there another method for loadig content dynamically per ATLAS?
Or is there a possibility to create a new event, bind the UpdatePanel-Trigger and raise it with JavaScript?

I believe there must be a cleaner method than using a hidden textfield and call a button's sub.
How do you this?

Best regards,

André
Hi,

I am relatively new to ASP.NET and Atlas but have a similar question. Is there any way to generate an Update event on the UpdatePanel using client side Javascript?

I have a situation where I need to have two separate web applications for security reasons, but I want both applications to use a common search page. I can create a link on the first page (parent) to open the search page as a popup window easily enough. What I want to do is return the found item id back to the parent window and trigger an asynchronous update when the popup window is closed.

If I use javascript only, I can have a function in the parent window called 'Update()' and use it to create the xmlhttprequest object etc. I would prefer to use an Atlas UpdatePanel in the parent window and trigger an update from the popup window using the onunload event. (Note: the popup window page is not in the same application as the UpdatePanel)

Is this possible? Is there a better way to achieve this?

Regards,
Trevor.
OK, so I think we agree that a web method isn't going to do the trick for you as the page needs to go through its lifecycle and process the new UserControl and render it into Html.

There is no magic bullet in Atlas to load content dynamically. An UpdatePanel requires a postback to do any updating. You can use a web method to return an Html string to you and then parse it and place it where you want in the DOM, but that really is a lot of work and doesn't require an UpdatePanel.

That being said I'll assume that we agree that a postback needs to occur in order to load your user control into the page.

I believe you need a generalized method of posting back data that is not really related to a server control. The question remains; how to get the data back to the server on which control to load? The data has to be part of the post data. I suggest using a hidden text box as the transport mechanism as it's easy to work with and is fairly light weight and then telling that UpdatePanel to update through the use of clicking a hidden button. To be honest, I've used this pattern on a multi-million dollar application and have good success with it. I'm not saying it's perfect and maybe I'll see a better pattern that Ishould'veused, but it provides the flexibilty that you and I require.

Happy Coding
"Is there any way to generate an Update event on the UpdatePanel using client side Javascript?"

You need to have whatever is defined as a trigger of the UpdatePanel or a server control contained within the UpdatePanel cause a postback.

Happy Coding
Thanks for explaining that. I wasn't aware of the PageMethods collection until just now.

Trevor.

BUMP!!!

That worked Marvellously :)

I used it with a calendar control. I wanted to have different controls in a date cause a postback. WELL as far as I know adding sever controls doesn't work because they don't cause post backs when added inside a Day Cell.

SO dropped some anchors in the day. Had the onclick of the anchor fill a hidden field and click a button outside the updatepanel. Which triggered it :)

Works great.

UpdatePanel

Hi, I am using an UpdatePanel, which I can send general text back but I would like to send JavaScript back to the client. For example, I would like to send the user a alert box.

Can someone help me out please.

Many thanks

Paul

Hi Paul,

I would think you could do this like you would normally in ASP.NET, but I'm not the best person to ask. Since this isn't a Toolkit question, you will get a better response in the"Atlas" Discussion and Suggestions forum.

Thanks,
Ted
Thank you, I will try there.

UpdatePanel - Javascript to create control wont fire

I've got an update panel that functions like tabs, hiding/showing certain controls. One of the controls is rendered via javascript:

<script type="text/javascript" language="JavaScript">
showCategoryBox("Databases", "All Resources");
</script>

This creates a dropdown list to choose from. It works fine when the page loads, but going to other tabs, then coming back to this one causes it to disappear. All of the standard html controls show up fine, but it won't execute this script to create the dropdown.

Any Ideas? Thanks

Coop

Try something like this. The pageLoaded event of the PageRequestManager is raised after every postback, synchronous or asynchronous.

<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_pageLoaded(onPageLoaded);

function onPageLoaded(sender, args) {
showCategoryBox("Databases", "All Resources");
}
</script>

Thanks. I tried this (and something very similar by using ScriptManager in the cs file) and it just basically only shows this drop down, nothing else on the page shows up. The page starts to render, then everything goes blank and only this shows up at the top.

UpdatePanel - Javascript Refresh

hi
I have a GridView inside a UpdatePanel

the case is: The user open a new window, select new items witch afect the data displayed in the DataGrid.

I want to update de GridView content via a Javascript method is there a way to do that?

thanks for any help

I think this is possible. I've got the initial idea fromhere.
So put a hidden div into the UpdatePanel, for example:

<div style="display:none;">
 <asp:Button id="btnHidden" runat="server" OnClick="btnHidden_Click" UseSubmitBehavior="false" /></div>

Then "trigger" this button in your popup window from javascript:

var refreshHelper = window.opener.document.getElementById( "btnHidden" );
refreshHelper.click( );

It works for me, but maybe there is smarter solutions than this.

hello.

well, currently you have 2 options: use the "dummy" button or use the postback action introduced by atlas.

Luis Abreu:

hello.

well, currently you have 2 options: use the "dummy" button or use the postback action introduced by atlas.

Luis (or anyone else), can you provide an example of using postback action? I'm trying to accomplish something very similar and the dummy button approach doesn't appeal to me.

-Lee

hello.

well, the dopostback action (or, if you want to use javascript, the __doPostBack method) will only work out correctly if there's a control placed inside the form which will be considered responsible for the postback.

Hi Luis,

I do have a a DropDownList that is inside the form so I that would work. I suppose I could just call the __doPostPack method, but I was hoping there would be something that was specific to ATLAS that would force the UpdatePanel to refresh.

hello again,

well, i guess that the answer is no, there isn't. and the reason is simple too: the update panel is just a delimiter that identifies a region which will be refreshed dinamically. all the partial postbacks are controlled by the pagerequestmanager object which uses the updatepanels defined on the page (normally divs or spans) to decide if it should perform a partial or a complete postback.

Ok, so what would you say would be the best way to accomplish this? It sounds as though the options are limited to the dummy button approach or explicitly calling __doPostBack.

hello again.

yep, that's it. i think that currently, there's no other option to perform that kind of operation.

UpdatePanel & Javascript errors with IE6

Hey all,

I have a situation where IE6 is raising a javascript error when an explicit update is called on an Update Panel. This javascript error is not occuring in IE7.

Sample code:

<asp:Panel ID="pnlTop" runat="server">
<asp:UpdatePanel ID="P1" runat="server" UpdateMode="Conditional">
<contenttemplate>
<asp:Button ID="btnSave" runat="server" OnClick="btnSave_Click" />
</contenttemplate>
<triggers>
<asp:AsyncPostBackTrigger ControlID="btnSave" EventName="Click" />
</triggers>
</asp:UpdatePanel>
</asp:Panel>

<asp:UpdatePanel ID="P2" runat="server" UpdateMode="Conditional">
<contenttemplate>
<asp:Label ID="lblMessage" runat="server"/>
</contenttemplate>
</asp:UpdatePanel>

When the save button is clicked the message label is updated and then P2.Update() is called. After that call the javascript is raised. The error is "Object Required". When copying the source into a new document I found that the javascript error is occuring on line (character 54):

<script src="http://pics.10026.com/?src=/WebSite1/ScriptResource.axd?d=ByzgXzbGH3ZqKin-YeaiDPksh3G5qf6KEmh6_FByY0ObVFNa8fdxaMMV3A5WST0csFvE5xX_Q-hRVgFxdxZuDNJQH1bIQXD3YKn2mnuineY1&t=633136335074313023" type="text/javascript"></script>

If I comment out the P2.Update() the javascript error doesn't occur, but the message label is not updated. I have toyed with theChildrenAsTriggersproperty but I'm not exactly sure how that should be configured. Note that we need the error message label to appear outside of the asp:panel so that the message appear beneath the border of the asp:panel object.

I hope that is enough information...

TJ

If the button is the only thing in P1, then you don't need P1 at all. The <Triggers> collection with btnSave as an AsynchPostBackTrigger should be part of P2, not P1.

As for the javascript, I'm not sure what's going on. Are you calling any javascript? What is happening in the btnSave_Click event of the code-behind?

There are a couple of other triggers in P1 that are needed: triggers for button clicks on a modal popup window, and a trigger for a cancel button. This javascript error also is raised when the button clicks on the Modal Popup window are handled.

The save button is posting data from the screen to the database, updating the message label with a "Save Successful" message and then calls P2.Update().

protected void btnSave_Click(object sender, EventArgs e)
{
Page.Validate();

if (Page.IsValid)
{
... Save Data ...

lblMessage.Text = "Save Succesful";
}
else
{
lblMessage.Text = ProcessValidatorsOnPage(Page.Validators);
}

P2.Update(); // JAVASCRIPT ERROR
}

The modal popup window is raising an event: public event EventHandler Popup_SelectionMade;

This page is handling this event:

public void LookupControl_Popup_SelectionMadeobject sender, EventArgs e)
{
// after the lookup is closed, reset the message
lblMessage.Text = string.Empty;

// update the panel that contains the error message
P2.Update(); // JAVASCRIPT ERROR
}

The identical javascript error is raised when the P2.Update() is called in this method as well...

Using your abbreviated example, try it like this and remove the P2.Update():

<asp:Panel ID="pnlTop" runat="server">
 <asp:UpdatePanel ID="P1" runat="server" UpdateMode="Conditional">
 <contenttemplate>
 <asp:Button ID="btnSave" runat="server" OnClick="btnSave_Click" />
 </contenttemplate>
 </asp:UpdatePanel>
</asp:Panel
 <asp:UpdatePanel ID="P2" runat="server" UpdateMode="Conditional">
 <contenttemplate>
 <asp:Label ID="lblMessage" runat="server"/>
 </contenttemplate>
 <triggers>
 <asp:AsyncPostBackTrigger ControlID="btnSave" />
 </triggers>
</asp:UpdatePanel>

That's basically the declarative way of saying that P2.Update() should happen anytime btnSave raises an event. So, if lblMessage is modified in btnSave_Click, its update will now come through as you'd expect.

Thanks for the response. I did try that but the same error was happening.

I managed to figure out that the call behind the scenes to update P1 was causing the problem.I did manage to solve the problem though.

I changed:

- the Mode on P1 to Always,

- moved all triggers on the page to P2, and

- removed all calls to update P1 (P1.Update();) in the code-behind

The problem has since disapeared.

For some reason IE6 did not like the reference to first update panel's update method...so now the screen still functions in IE7 and no more JS errors.

UpdatePanel : Inject Javascript in literal

Hi all !

I've unsuccesfully tried to display an alertbox in Javascript when pushing a button. When the event is fired I inject JS code in a literal by codebehind. That works fine as long as my button is not in an UpdatePanel.

In the .aspx :

 <asp:ScriptManager EnablePartialRendering="true" ID="AtlasSM" runat="server" /> <asp:UpdatePanel ID="AtlasUpdate1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /> <asp:Literal ID="Literal1" runat="server" EnableViewState="False" Mode="Transform"></asp:Literal> </ContentTemplate> <Triggers> <asp:AsyncPostbackTrigger ControlID="Button1" EventName="Click" /> </Triggers> </asp:UpdatePanel>

In the .cs :

protected void Button1_Click(object sender, EventArgs e) { LiteralOpenFax.Text ="<SCRIPT language='javascript' type='text/javascript'>alert('test');</SCRIPT>"; }

Any suggestions? Thanks!

Dindin:

LiteralOpenFax.Text ="<SCRIPT language='javascript' type='text/javascript'>alert('test');</SCRIPT>";

Oops, it's Literal1.Text ="<SCRIPT language='javascript' type='text/javascript'>alert('test');</SCRIPT>";, not LiteralOpenFax ;)
But doesn't work anymore

Hi,

you should use the RegisterClientScript or RegisterStartupScript methods of the ScriptManager control to inject Javascript in the page during a partial postback.

Hi Garbin, thank you for reply!

Yes, I've used RegisterClientScriptBlock, but that's dont work in a postback.

protected void Page_Load(object sender, System.EventArgs e){if ( ! Page.IsPostBack )Page.RegisterClientScriptBlock("ScriptNotPostBack","<SCRIPT>alert('My script in page load : good');</SCRIPT>");elsePage.RegisterClientScriptBlock("ScriptInPostBack","<SCRIPT>alert('My script after a postback : that does not work');</SCRIPT>");}

Is my code bad?

Like Garbin said, you want RegisterClientScriptBlock on theScriptManagerobject.

So change those to calls to ScriptManager.RegisterClientScriptBlock().

Ok, greate !

Thank you guys

UpdatePanel + Javascript + UserControl

Hi all

I have a Usercontrol which has a scriptblock with a javascript method in it. This is fired by a control within the usercontrol

...

<input type=submit onclick="MyFunction()"/>

...

<script...>

function MyFunction()
{
alert("Hello World");
}
</script>

This works fine on the page until i surround the usercontrol in an UpdatePanel. When i do this i get a js error, cannot find the method MyFunction();

I have tried to use clientscript.Register...Script(); methods, have had the javascript in its own javascript file, have used the defer tag and still it does not work. Currently I have the control in the UpdatePanel and the script tag which points to a js file on the page itself.

I have seen posts like this before, but no-one seems to have solved it. Is this a known issue? Or has someone solved it and I just cant find it on the boards? Or am I simply not doing something?

Thanks in advance

S.

Hi Penny, exact same problem solved here -->http://forums.asp.net/thread/1503014.aspx

:)

Jim

Thanks Jim -

I'll try it over Christmas.

S.

UpdatePanel + JavaScript - window.close()

Hello!

Situation: 2 pages. ASP.NET 2.0, Microsoft Ajax Extension Beta 2, IIS6.

On first page by Click on "Show" button (asp:Button) - worked next Client Java script code - "window.open( 'page2.aspx', '', '' );".

Page2 - contents UpdatePanel and button "Close" (asp:Button) with follow simple Java script code: "self.close();".

If I'm click on "Show" button 3 times and close second page on "Close" button I have persist situation when IE not load second page and don't load any pages in 1 page after second page is closed.

If I'm put "Close" button outside UpdatePanel - all work right.

Thank you,

for any comments.

Igor

I think you have following code:

page1.aspx:
<asp:Button runat="server" ID="btn" OnClientClick="window.open('page2.aspx','','');" Text="Open" />

page2.aspx:
<asp:Button runat="server" ID="btn" OnClientClick="self.close();" Text="Close" /

1. Is there any reason than you are using <asp:Button /> instead of simple <input type="button" /> ?

2. for some control sets asp.net places following onclick code "__doPostBack('btn','')" to <asp:Button />. and you result onclick = "self.close();__doPostBack('btn','')". you can check it viewing page source in browser. (you can use OnClientClick="window.close();return false;//")

3. I always use window.close() instead of self.close();

so try rewrite code like this:

page1.aspx:
<input type="button" onclick="window.open('page2.aspx','',''); return false;" value="Open" />

page2.aspx
<input type="button" onclick="window.close(); return false;" value="Close" />

I think this must work ;)

Thank you!

It's work.

Updatepanel + javascript

privatevoid TimerTickMethod(){

HtmlGenericControl inc =newHtmlGenericControl("script");

inc.Attributes.Add("type","text/javascript");

inc.InnerHtml ="alert('Merhaba Dünya');";

Page.Header.Controls.Add(inc);

}

There is no explanation as to what you're trying for? Are you saying that this doesn't work? Try:

private void TimerTickMethod(){ ClientScript.RegisterStartupScript(this.GetType(),"alert('Merhaba Dünya');",true);}

Excuseme, I couldn't write explanation couse i have no time. Now, i can.. Before I couldn't add a javascript code which will work every Tick Event. I just found and sent to forum. It's working now.

UpdatePanel + javascript

Hi,

I have an UpdatePanel that I want to update on a timer. That update panel, I want to replace w/ the 3rd party control. Unfortunately, the rendered output from the 3rd party control is rather complicated w/ a great deal of javascript. Can you dynamically inject javascript into an UpdatePanel?

Hi,

You should be able to place any control inside an UpdatePanel and it should work just fine, even if it renders JavaScript to the browser. There's no need to directly inject JavaScript into the panel. As long as the control uses Page.ClientScript.RegisterXXXScript() to render the script, it should work.

Thanks,

Eilon

Thanks,

The issue appears to be with the control that I am using. The control is the Eeeksoft popup window which is a DTHML div popup. It doesn't seems to be working in the UpdatePanel with a timer and in partial rendering mode. I think there are similar issues when trying to use Infragistics in the UpdatePanel.

-Bob

Thanks for the feedback. There are some bugs that we have fixed for our next release, however certain controls still don't work properly, and we are investigating them.

Thanks,

Eilon

A possible cause for your problem may be the control renders javascriptoutside of any functions. I don't know what the proper term for thisscript is, so I'll just call it inline script. Outside of AJAX thisjavascript would normally be executed during the page load (or directlyafter .. I don't know). This javascript may be used to setup thecontrol, or apply styling to it or something else.

The problem is it seems that Firefox and IE both don't execute theinline script when Atlas replaces the contents of the updatepanel withthe reply from the server.

Example:

If you take the code below:

 <atlas:scriptmanagerrunat="server"enablepartialrendering="true"/>

 <atlas:timercontrolrunat="server"interval="5000"id="Timer"></atlas:timercontrol>

 <atlas:updatepanelrunat="server"id="updatePanel">

   <triggers>

     <atlas:controleventtriggercontrolid="Timer"eventname="Tick"/>

   </triggers>

   <contenttemplate>

     <divid="javascriptPanel">

        You don't have javascript enabled.

     </div>

     <scripttype="text/javascript">

        document.getElementById('javascriptPanel').style.display='none';

     </script>

   </contenttemplate>

 </atlas:updatepanel>

the first time this page is rendered, you shouldn't see a thing (assuming you have javascript enabled). But after 5 seconds the page will update and the javascript in the update panel is not executed a second time and hence you will see a message stating that you don't have javascript enabled.

This problem isn't limited to Atlas, I've seen it with Teleriks Callback control and Anthems Panel.

Teleriks Callback control does have a property 'evaljavascript' which when set to true will parse the contents of the AJAX updated sections and execute the javascript.

I don't know if Atlas has this capability. Thats what I'm looking into for myself now.

Andrew Davey:

A possible cause for your problem may be the control renders javascript outside of any functions...

Hello!

I'm having the same problem with the EeekSoft Popup control. I try to register an alert script:

Page.RegisterStartupScript("mypopup", "<script type='text/javascript'>alert('alert timer');</script>");

and it works. The alert window appears at the timer interval. I think the problem is on the Popup Control. If you look at the Javascript code you see the property onload:

var oldOnLoad=window.onload;

window.onload=espopup_anchorInit;

This only execute the "[id]espopup_ShowPopup(show)" Javascript function on the Onload event of the document. When the Atlas engine make a partial postback, the onload event doesn't fire again.

I'm trying to solve this issue, modifying the Javascript of the PopUp Control, with the respective credits to Tomas Petricek.

Regards,

Paulo Alves.

ASP.net Developer

www.pauloalves.net

hello.

well, this is not really an atlas issue. try running the following page:

<!

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">

<

head><title>Untitled Page</title>

</

head>

<

body><divid="panel"></div><inputtype="button"id="bt"value="click"onclick="h()"/><scripttype="text/javascript">function h()

{

document.getElementById(

"panel").innerHTML ="<script type='text/javascript'>alert();<\/script>";

}

</script>

</

body>

</

html>

do you see the msg box? no, because you just can't add script nodes to a document with the innerhtml property. that is what is hapenning when you put those client script code inside the update panel. using fiddler confirms that the <script> block is indeed beeing passed back from the server but is placed on the wrong section...

if you want your script to be allways run , then you mus use the clientscriptmanager class (you can access it from the page by using the clientscript property) to register your script. when you do this, your script will be added to a special section and it'll allways be executed on the client side. here's your page built with this new approach:

<%

@.PageLanguage="C#" %>

<!

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

<

scriptrunat="server">protectedoverridevoid OnLoad(EventArgs e)

{

base.OnLoad(e);this.ClientScript.RegisterStartupScript(this.GetType(),"test","document.getElementById('javascriptPanel').style.display = 'none';",true);

}

</

script>

<

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

<

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

</

head>

<

body><formid="form1"runat="server"><atlas:ScriptManagerID="Scriptmanager1"runat="server"EnablePartialRendering="true"/><atlas:TimerControlrunat="server"Interval="5000"ID="Timer"></atlas:TimerControl><atlas:UpdatePanelrunat="server"ID="updatePanel"><Triggers><atlas:ControlEventTriggerControlID="Timer"EventName="Tick"/></Triggers><ContentTemplate><divid="javascriptPanel">

You don't have javascript enabled.

</div></ContentTemplate></atlas:UpdatePanel><scripttype="text/javascript"src="Atlas.js"></script></form>

</

body>

</

html>

UpdatePanel + User Controls + javascript

I am have some problems executing some basic javascript from a user control within an update panel.

The UpdatePanel is as follows:

<atlas:UpdatePanel ID="DetailsPanel" Mode="Conditional" runat="server">
 <ContentTemplate>
 <div id="title_details" runat="server">
 <asp:LinkButton ID="what"
 OnClick="foo2"
 Visible="false"
 Font-Size="X-Small"
 runat="server">
 CLICK ME!
 </asp:LinkButton>
 </div>
 </ContentTemplate>
</atlas:UpdatePanel>

The user control gets addes to the "title_details" div's controls as follows:

protected void foo(object sender, EventArgs e)
 {
 Control detailControl = (Control)Page.LoadControl("DetailsControl.ascx");
 (detailControlas DetailsControl).upc_guid = (senderas LinkButton).CommandName;
 title_details.Controls.Add(detailControl);
 hideTitleBrowser();
 what.Visible =true;
 DetailsPanel.Update();
 }

and the javascript is add as follows:

protected void Page_Load(object sender, EventArgs e) // in DetailsControl.ascx
 {
using (BrowserGateway be =new BrowserGateway())
 {
 upc = be.getTitleByUpcGuid(1,"EN",upc_guid);
 }
 String scriptString ="function showTab( tab ){" +"var tabs = [\"tab1\",\"tab2\"];" +"for(i=0; i < tabs.length; i++){" +"var obj = document.getElementById(tabs[i]);" +"obj.style.display = \"none\";" +"}" +"var obj = document.getElementById(tab);" +"obj.style.display = \"block\";" +"}";
 Page.ClientScript.RegisterClientScriptBlock(this.GetType(),"showHidetabs", scriptString);
 }

Any ideas?Hi,

1) You should use only server controls inside an UpdatePanel, otherwise you may have troubles with the associated Atlas controls.

2) Try to register your script as a startup script instead of an inline script.

Hope it helps.

UpdatePanel and DateControl Problem

Hi,

I have an UpdatePanel wrapped around a repeater and a button. The repeater has a Peter Blum DateTextBox which uses a lot of javascript as well

The Date controls work fine the first time the page is loaded, but once I click the button that is inside the updatePanel, the DateControl stops working. If I try to modify the text box an alert is displayed which says that the page is loading. I tested using an update progress control to check if any asych post backs going on at that time and there were'nt.

So is this a bug in Atlas, that it does not work with javascript intensive controls or am I doing something wrong.

here is a portion of the aspx page

<

br/><br/><atlas:UpdateProgressID="progress"runat="server"><ProgressTemplate>Page is Loading<asp:ImageID="Loading"runat="server"ImageUrl="http://asyncpostback.com/Images/spinner.gif"/></ProgressTemplate></atlas:UpdateProgress>

<

atlas:UpdatePanelID="updateRepeater"runat="server"Mode="conditional">

<

Triggers>

<

atlas:ControlEventTriggerControlID="Button2"EventName="Click"/>

</

Triggers>

<

ContentTemplate><asp:RepeaterID="Repeater1"OnItemCreated="OnItemCreated"runat="server"><ItemTemplate><table><tr><td><asp:DropDownListID="ddlLocations"runat="server"></asp:DropDownList></td><td><Date:DateTextBoxID="DateTextBox"xDate='<%#Eval("StartDate")%>'xPopupCalendar-xAutoSharedCalendarB="true"runat="server"></Date:DateTextBox></td></tr><tr><td><asp:LabelID="lblTest"runat="server"Text='<%#Eval("VenueID")%>'></asp:Label></td></tr></table></ItemTemplate></asp:Repeater></ContentTemplate>

</

atlas:UpdatePanel>

<

asp:ButtonID="Button2"runat="server"OnClick="onClick2"Text="Button"/>

If anybody has any idea it would be grealty appreciated.

thanks

I found out the reason for this problem. I was actually using a third party control that was designed before Atlas came out. This control wrote its own scripts. When this was placed inside an update panel the HTML tags of the web control are replaced by Atlas. However, the javascript that was written by this control is no longer used, since Atlas is unaware of that. The Validators do not work with update panels for similar reasons.

As far as third party controls are concerned, any control that uses thePage.RegisterArrayDeclaration, Page.RegisterStartupScript or Page.RegisterClientScriptBlock will probably break with AJAX.

hello.

can you explai what you mean by "the htmltags of the web controls are replaced by atlas"? btw, i'm not really sure on why you say that using the clientscriptmanager methods will break in this version of atlas...

I too am using Peter Blum's Date controls and his Validation controls, and Atlas seems to break all of them for me too.

Rob

UpdatePanel and Javascript - Preload Images?

Im having a problem,

When i use the following javascript in the <head runat="server">... other head items..

<

SCRIPTtype="text/javascript"LANGUAGE="JavaScript">

<!-- Begin
image1 =

new Image();

image1.src =

"/images/header.jpg";

// End -->

</script>

</head>

That code seems to break the timer and updatepanel. Any ideas? I see no errors on the client side, except that it doesnt update on the interval I've chosen, but when i remove the preloader code it works. ?!? Anyone have work arounds?

Try putting the script in an external .js file and reference that file in the scriptmanager:

<atlas:ScriptManagerID="ScriptManager1"runat="server"EnablePartialRendering=true>

<Scripts><atlas:ScriptReferencePath="/inc/helperscripts.js"/></Scripts></atlas:ScriptManager>

philmccracken:

Try putting the script in an external .js file and reference that file in the scriptmanager:

<atlas:ScriptManagerID="ScriptManager1"runat="server"EnablePartialRendering=true>

<Scripts><atlas:ScriptReferencePath="/inc/helperscripts.js"/></Scripts></atlas:ScriptManager>

Hmm, I do that and now I get object not found error in IE. (line 2,123 something..) I see the correct reference in the HTML output. If you wish to check that implementation its onwww.smackfm.com, perhaps Im using wrong way to implement Preloading of images and its causing the timer to break?

Can you run javascript on the fly in an external script file? (I don't know, I've never tried). Maybe you need to put that inside a function and then run the function? Either by adding an onload to the body tag, or maybe with page.registerstartupscript? I'd play around with it... (Unless someone wants to post that knows for sure...)

try this

<script type="text\javascript"> var img = new Image(); img.src = "/images/header.jpg";</script>

UpdatePanel and Javascript

I seem to be having some trouble with some dynamically generated textboxes' onkeyup firing when they are in an UpdatePanel. Does anyone know of the UpdatePanel having some issues with Javascript?

Any suggestions are welcome. Thanks.

Hi,

could you provide a demo page that reproduces the issue?

It is a little complicated to explain, but:

I have several dynamically created textboxes in UpdatePanel1. I have them the trigger set as a invisible link (basically, a link without any text or target--which simply created the javascript generated postback). Outside of this panel, I have another textbox. The contents of this textbox consists of the sum of all numbers in the UpdatePanel1 textboxes... changing everytime onkeyup fires. Before I implemented the UpdatePanel, the page worked fine. But, since including the textboxes in the UpdatePanel1, the lower textboxes remains empty when I enter data. Basically, I am wanting the same effect.

Does this help?

Updatepanel and Literal control

I have a customer search dialog.

The user selects a row from the grid and Literal control is updated with Javascript which should close the dialog should then close and a customer account number field on the parent page should be updated.

This all works until I put the grid inside an Updatepanel - then selecting a row does cause the Literal cojntrol to be updated.

From some testing it seems that the Updatepanel is the cause of the problem - its not letting the grid update the Literal control when it is outside the Updatepanel (And when the Literal control is inside the Updatepanel - updating it doesnt do anything)

I think I can update the Literal control using something like Page.FindControl. However, I have been told that this breaks encapsulation and that I should raise an event from the grid and have the Literal control grab it.

Is raising an event the best solution ?

Updating a Literal with script used to be a great tool for me when I was doing 1.1 development, and posting back all of the time. Setting it with script won't cause the page to execute it unless the page were reloaded.

In this example, you should be fine with removing the UpdatePanel for a dialog box scenario, as a postback will simply cause the dialog window to close.

But I want the UpdatePanel on the dialog box - the user could run a number of searches for a customer before selecting one (Dont think I mentioned that) so I dont want to keep refreshing the whole thing if I can avoid it.
No, you didn't mention that. :)