Bumpbox With ASP.NET Update Panel

I just spent hours trying to figure out why my standard ASP.NET Update Panel was not working in Firefox or Chrome.

Basically, here's the situation:

I had an UpdatePanel on a content page. The ScritManager for the UpdatePanel was on the MasterPage. I used the default ASP.NET ScriptManager like this:

<asp:ScriptManager ID="ScriptManager1" runat="Server"></asp:ScriptManager>

On the update panel, I had a series of buttons that when clicked, were supposed to obviously post back to the server, get the results, and then post them back to the UpdatePanel. This was working fine in IE, but when I tried to run the same test in Firefox and Chrome, it would only post back the first call, then every call subsequent call after that made from within the UpdatePanel would fail. In fact, I noticed that after the first post back was made, all of the controls on the UpdatePanel were disabled. Not that they were disabled as if setting a control to be disabled, but they just did not do anything.

So, being a good troubleshooter, I decided to start from scratch and create a whole new solution using ONLY an UpdatePanel, a few controls, and one line of code. Basically, I created an asp:TextBox, an asp:Button, and an asp:Label. I threw all of these controls into an UpdatePanel. My intentions were this: I would load the page, type something into the textbox, click the button, and have whatever I typed show up in the label. Simple enough.

So, I went ahead and created this page, then tried it out. As I expected, it worked in IE. I moved to Firefox. It WORKED! I moved to Chrome - again, IT WORKED! So...I was puzzled at this. So, I thought to myself, "alright, well the only explanation is that there is something that is different from my actual webpage vs. my recreated project." So...I started adding pieces of my web project to the test project. I started with some javascript references from the MasterPage. Guess what?? It broke after I made my first script references. These script references were to mootools.js and bumpbox.js. For those of you who do not know what mootools is, you can find it here:

http://www.artviper.net/news/Bumpbox---lightbox-with-PDF-support/21/en

So, my findings were this:

You CANNOT use the ASP.NET UpdatePanel in conjunction with referencing the mootools script. If you do not need the mootools script on all pages, my suggestion would be to only load the mootools and bumpbox javascripts on the page(s) that you actually need them. This way, you might be able to avoid a conflict of mootols and the UpdatePanel.

I hope this helps you and saves you hours of work!