In continuing the series on the Nucleo MVP framework, we’re going to look at how easy it may be to use AJAX.  Like the web services proxy generation to the server-side web server, the Nucleo MVP currently supports limited AJAX proxy support (with more support to come).  Using the Nucleo.Web.MVP framework, the project and the BaseWebPresenter presenter class, a client-side proxy can be generated to call server-side static methods first by adding the following attribute:

 [PresenterAjax(EnableWebMethods = true)]
public class AjaxCallbackPresenter : BaseWebPresenter<IAjaxCallbackView>

The EnableWebMethods setting triggers a look for the [PresenterWebMethod] attribute on a static method.  The process would find the following two methods:

 [PresenterWebMethod]
public static void AddItem(string item)
{
 List<string> items = HttpContext.Current.Cache.Get(“Items”) as List<string>;
 if (items == null)
  items = new List<string> { };

 items.Add(item);

 HttpContext.Current.Cache[“Items”] = items;
}

[PresenterWebMethod]
public static List<string> GetItems()
{
 List<string> items = HttpContext.Current.Cache.Get(“Items”) as List<string>;
 if (items != null)
  return items;

 return new List<string> { “A”, “B”, “C”, “D”, “E” };
}

The PresenterWebMethod attribute points these two methods as methods to be proxied in client-side JavaScript.  Right now, the methods have to be static; though, I am working on adding to the process the ability to talk to instance methods too.  At runtime, the n$.Presenters collection contains our AJAX presenter, and renders a proxy for the two methods, AddItem and GetItems.  We can see this in the works through the following proxy:

n$.Presenters[“AjaxCallbackPresenter”] = (function() {
return {
 AddItem: function(item, successCallback, failedCallback) { .. },
 GetItems: function(successCallback, failedCallback) { .. }
};
})();

The proxy makes a web request to a handler that invokes the corresponding presenter on the server, which happens the following way:

 n$.Presenters[“AjaxCallbackPresenter”].GetItems(function (response) {
       $get(“<%= lblOutput.ClientID %>”).innerHTML = response.data.toString();
});

 n$.Presenters[“AjaxCallbackPresenter”].AddItem($get(“<%= txtValue.ClientID %>”).value, function (response) {
 updateLabel();
 $get(“<%= txtValue.ClientID %>”).value = “”;
});

And as such, we have client/server integration to the presenter, just like ASP.NET MVC or  web services/page methods.