How to: Solve the “empty Ajax Update Panel” predicament; or, why do controls that live in an UpdatePanel always display last.

A funny thing happens if you’re using an empty Ajax Update Panel on your page/control definition in order to programmatically add controls from your code behind.

Any controls that are defined after the Update Panel will actually appear before it when the page renders.

I was losing my mind over this, not knowing if it was a css/styling error or whether I was just going crazy. However, none of that is true.

The Update Panel will (apparently) be populated after the controls that have been defined onto the actual page. In order to solve that, I had to add an asp Panel inside the Ajax Update Panel and programmatically add my controls inside the new asp Panel. Not into the Ajax Update Panel directly.

That way, when the page starts rendering, there is already a control inside the Ajax Update Panel and it will be inserted in the correct location. Afterwards, when the code starts adding controls in the asp panel (which is inside the Update Panel), everything will appear as expected.

MGR: the Intelogist

About MGR: the Intelogist

SharePoint Server developer, turned Sitefinity developer, turned Angular developer, turned SharePoint Online consultant, turned Unily consultant, turned O365 consultant... Never a dull moment!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> 

This site uses Akismet to reduce spam. Learn how your comment data is processed.