Showing posts with label custom. Show all posts
Showing posts with label custom. Show all posts

Saturday, March 24, 2012

UpdatePanel and custom Extender: two components with the same id cant be added to the appl

I am experiencing some strange behavior in my UpdatePanel which contains a ListView with a DataPager control. The items in the list view each have a custom ModalPopupExtender that is dynamically generated as well as a custom extender control that does some manipulation on an image.

The first page of results loads correctly, and I can move to the next page fine as well. However, when I move back to the first page, Firebug shows me the 'two components with the same id can't be added to the application' exception thrown on each of the items on the first page of the list, on the behavior associated with my custom extender. This to me seems that the partial update does not destroy or dispose the extender's behaviors when I move to the next page, so when I try to render the first page again, those extenders are still sitting in memory.

Now the kicker is, if I go to the next page and back to the first page a second time, my behaviors load correctly. Repeat and they don't show up and new errors are fired. I know this has to do with the lifecycle but I can't seem to pin it down.

Now my custom extender is fairly straightforward and only calls the base dispose() method for its own dispose() function. What am I missing?


I have narrowed down the issue to the fact that the Extender control uses a callback to attach an event to an image that has loaded dynamically from a web service call:

_onMethodComplete : function(result, userContext, methodName)
{
// Wire up image effect
var i = this.get_element();
i.onload = function(i)
{
asyncEffect(i); // This function lives in an external effects.js file
}

// Do after onload event to pick up change
this._setImage(result);
}

Doing this prevents the extender from disposing, possibly because it's still got a handle to an external JS file. I blanked out the image's onload event after the effect completes and the extender works for images that weren't previously on the page, but is still not disposing the extender correctly. Commenting out the wire up code above corrects the issue (obviously without the effects the JS file would bring).

How can I cleanly dispose an extender that references an external JS script?

UpdatePanel and CompositeControl

Hi,

I want to make a custom date selector server control. I am inheriting from the CompositeControl base class. As usual I override the "CreateChildControls" method and add my controls to the "Controls" collections. Among them is an UpdatePanel that should contain a Calendar control. I'm having problems creating and adding the UpdatePanel. How should I go about doing this?

This is my code so far for the "CreateChildControls" method:

namespace

Test.Presentation.Web {
publicclassDateTimeDropDown :CompositeControl {
UpdatePanel _updatePanel;
Calendar _calender;
testTemplate _template;
protectedoverridevoid CreateChildControls() {
_calender =newCalendar();
_updatePanel =newUpdatePanel();
_template =newtestTemplate(_calender);
_updatePanel.ContentTemplate = _template;
_updatePanel.ID =this.UniqueID +"_up";
this.Controls.Add(_updatePanel);
}
}
classtestTemplate :TemplateControl,ITemplate {
Control _control;
public testTemplate(Control control) {
_control = control;
}
publicvoid InstantiateIn(Control container) {
container.Controls.Add(_control);
}
}
}

I get the error message:System.InvalidOperationException: The UpdatePanel 'Test1_up' was not present when the page's InitComplete event was raised. This is usually caused when an UpdatePanel is placed inside a template.

I'm quite new to makeing custom controls so I'm probably missing something obvious here. Any suggestions to how I can accomplish this?

Thanks!

Ole Gulbrandsen

Pherhaps it is not possible to include an update panel in a composite control?

hello.

well, you can if you instantiate it before the init event (as the previous error reported)


Hi, thanks. This code works:

public class DateTimeDropDown : CompositeControl {
UpdatePanel _updatePanel;
Calendar _calender;
protected override void OnInit(EventArgs e) {

_updatePanel = new UpdatePanel();
_updatePanel.Mode = UpdatePanelMode.Always;
_updatePanel.ContentTemplate = new testTemplate();
_updatePanel.ID = "updt";

_calender = new Calendar();
_calender.ID = "cal";
_updatePanel.Controls.Add(_calender);
this.Controls.Add(_updatePanel);
base.OnInit(e);

}
}
class testTemplate : TemplateControl, ITemplate {
public void InstantiateIn(Control container) {
}
}

The above code, work, but if I build composite control of this one again I get into problems. I need to understand more of whats going on. Does anyone know any good sources for reading about how updatePanels fit into the page life cycle and how to incorporate them in custom controls ?

Ole


hello.

hum...i guess that there's not much to say:

* you have to add the trieggers till the end of the init event
* the panel initializes its template during the oninit event

i think this is all :)

you asked for resources...well, i guess that currently you only have .net reflector ;)


ok, I'll experiement a bit more with this, hope Microsoft can provide more documentation soon.

thanks for the help!

UpdatePanel and custom javascript.js files

Hi,

We are piloting Atlas for our web project and for the most part it works quite well. We are mainly using UpdatePanels to return validation details which need to be processed on the server based upon business rules.

The issue we have is to do with Atlas and our own custom javascript .js files which we include on some pages. When we include our .js files using the follwing syntax:

<script language="javascript" src=../js/hints.js></script>

We get a message box appear stating 'unknown error' under IE and no response under FireFox. If we paste the actual source code from the hints.js file into the aspx page like:

<script language="javascript" src=../js/hints.js>
function(page, name)
{
window.open(page, name);
return
}
</script>

Everything works fine. The partial postback works returning any validation error messages. This is in both IE and FireFox.

This poses a problem for us as we have a standard template of .js files which we include on every page via an include.htm file.

Since Atlas uses javascript, do we have to include our own custom scripts a special way, or is this a bug with Atlas at the moment?Hi,

a couple of suggestions:

1. you should add the type attribute for a script element: <script type="text/javascript" /> Atlas does some of its stuff by searching for the type attribute, so you may experience problems if you omit it.

2. enclose an attribute's value in double quotes: src="http://pics.10026.com/?src=../js/hings.js"

3. Do not put the script element in the <head /> section of the page when using Atlas.

4. Use the Page.ClientScript API if you are going to inject client script blocks in the page.

5. If you want to keep everything in one place, add a reference to your custom script in the Scripts section of the ScriptManager control.