Flicker-Free Web Pages (no javascript required)

I’ve spent the last few weeks playing with ASP.NET 2.0, and I’ve enjoyed using the AutoPostBack feature of the various server controls.

But one thing that drives me nuts is flickering web pages from the aforementioned AutoPostBack-enabled server controls, especially in the “Web 2.0 – Everything Is AJAX And If It’s Not It’s Just Crap” times we live in.

So, I started thinking more and more about AJAX, specifically the ASP.NET AJAX extensions. I started reading articles, help files, and book chapters but, doggone it, I just didn’t get the concept.

Then I watched a video on the ASP.NET web site that gave me the “a-ha!” moment I needed.

Basically, you just do the following:

  • Add a ScriptManager control to the page
  • Add an UpdatePanel control (for the piece of the page you want to update
  • Set the <ContentTemplate> tag of the UpdatePanel (this is the HTML you want displayed in the UpdatePanel part of the page)
  • Set the <Trigger> tag of the UpdatePanel, telling it which control and event on the page that should “fire” the update

I put together a small web site to demonstrate the results of the “a-ha!” moment, and also put together a screencast to show anyone that hasn’t yet had the “a-ha!” moment how easy it is to add partial page update functionality to an existing web page.  Be sure to click the “full-screen” button for best results.

Please, before I start getting comments about how elementary my code and examples are, let me say this: “I am a Visual FoxPro developer, not a .NET developer, and I’m learning this stuff day-by-day.”

And here’s a link for the code.

Side note: the downloads are hosted in a public folder I set up on Skydrive. No bandwidth charges, and no hosting charges! Just a thought for folks who might have something cool to share but do not want to pay out the wazoo if it becomes popular.

Enjoy!


This post originally appeared on Blogger.