Today, any Web framework hosts a good deal of AJAX features, and ASP.NET MVC is no exception. When it comes to AJAX, all programming interfaces differ from one another in the way each hides its own calls to the underlying XMLHttpRequest object. Typically, in ASP.NET MVC you use two wrappers for low-level XMLHttpRequest calls: the jQuery API for AJAX and native AJAX helpers. AJAX helpers are sort of markup factories based on a specific AJAX-oriented JavaScript library that comes with ASP.NET MVC.
If you use the jQuery API for AJAX, then you do everything from the client side. Your code that places the calls and processes the results is written entirely in JavaScript and is under your control. The HTTP endpoint that is the target of the AJAX call can be an existing Web service (reached in accordance with standing same-origin policies) or, more likely, an action method on some ASP.NET MVC controller that returns JSON data. This approach offers maximum flexibility at the cost of padding your pages with a lot of JavaScript code.
In this article, however, I want to address another ASP.NET MVC approach to AJAX based on helper components. This approach doesn’t have an official name. In many ways, it's similar to classic ASP.NET partial rendering, but done better. To make a distinction, I’ll call it selective update. In the rest of the article, I’ll discuss the subtleties of using selective update extensively.
The Mechanics of Selective Update
Selective update refers to an application’s ability to refresh only a fragment of the current view in response to some user actions. User actions are essentially of two types: clicking on hyperlinks (known as action links in ASP.NET MVC jargon) and submitting the content of a form.
With action links, a user triggers an asynchronous action on some HTTP endpoint, receives any markup being returned, and uses that to refresh a specific section of the existing view. You can configure the AJAX request to be GET or POST; the composition of the URL determines which parameters are passed to the target.
With AJAX forms, you simply post the content of the HTML form to which the clicked submit button belongs. You can configure the HTTP verb to be GET or POST and include additional parameters (beyond the content of the input fields) at will.