Andrew L. Van Slaars

I have recently started developing a website using ASP.NET MVC (preview 5). One of the things I love about the MVC framework is the total control I have over my markup. I can keep the HTML clean, use ID values that make sense and won’t change each time the page is rendered and I can add all of my own client-side interactivity using jQuery (without the id mess that web controls create).

One of my goals with this new site is to create a functional site that works and renders in a usable manner even with CSS and JavaScript disabled. In order to do this, I have been creating all of the required interactions using standard get and post operations. The next logical step is to add Ajax functionality as a progressive enhancement using jQuery. Since ASP.NET MVC is still pre-beta, there isn’t a lot of documentation or published best practices with specifics about how to best handle this through the framework. I have read several posts from others with different solutions, they range anywhere from routing hacks (including ajax or html in the url) to seperate views (one standard view and an ajax enabled view). None of the solutions I have found have been what I wanted to do, so I set some goals for how I wanted it to work and through a process of trial and error, I have a solution. Through the next couple of posts, I will outline how I am handling this. I look forward to any feedback (good or bad) and if somebody has a better solution, please let me know.

The Goals

1. Site should work in an acceptable manner without JavaScript enabled
2. The same view should handle both Ajax enabled and standard post/get operations
3. All controller code should be run in either scenario except for returning the ActionResult
4. Changes to the controller action signature should be minimal and the same approach should work for any controller action (with minimal change)

Some of these goals are no-brainers, it helped to have all of the goals in place to keep myself from creating a massive amount of “Franken-code” in order to get the site working. I also realize that using the word “minimal” when talking about code changes is subjective, so if you don’t think what I have done is minimal, feel free to comment on the posts that contain the code and we can discuss it, please just share something more than “your solution sucks…” that won’t help anybody. And, if you have any other goals that you think I shoudl keep in mind, please let me know. I can’t promise that I’ll be able to attain more than I have already planned for in this series, but if something that I haven’t thought of seems important enough, I will do my best to try to meet the new criteria.

Upcoming Posts

• Handling the Controller Action Code to allow for Ajax and non-Ajax calls
• Calling your controller with jQuery
• Handling the Ajax response with jQuery
• Enhancing the User Experience with jQuery

Stay tuned. I have the code worked out for the most part, but it hasn’t been fully implemented, so I will be posting as I make more progress and I have tested enough to feel confident that I will have working code. I’m hoping to get the first post that has any real substance out before the end of the week.

Andrew .NET, ASP.NET, Ajax, JavaScript, MVC, jQuery Ajax, ASP.NET, JavaScript, jQuery, MVC, Progressive Enhancement