Michaels Blog | Download AjaxPro Beta with jQuery Support

I forgot to put the beta version online that will support jQuery and json.js from http://www.json.org^[1]. You can download the latest beta of the AjaxPro library at http://www.ajaxpro.info/download/jQueryAjaxPro.zip^[2]. The download currently includes only the .NET 2.0 library including a Visual Studio .NET 2005 Web Site project.

The C# AjaxMethod

I added a very simple AjaxMethod HelloWorld which will only return a string and get one argument. The reason is that I don't have included the new JSON converters which will be ready in the next days.

[AjaxPro.AjaxMethod]<span class="kwrd">public</span> <span class="kwrd">static</span> <span class="kwrd">string</span> HelloWorld(<span class="kwrd">string</span> s)

{

<span class="kwrd">return</span> <span class="str">"Hello "</span> + s + <span class="str">"!"</span>;

}</pre>

The generated JavaScript code for jQuery

The JavaScript wrapper will look similar to the AjaxPro files, but using no AjaxPro JavaScript function, now. For the JSON serialization of JavaScript objects I'm using the json.js.

<pre class="csharpcode">MyClass_class = function() {};
MyClass_class.prototype.url = '/WebSite2/ajaxpro/_Default,App_Web_hae3khd4.ashx';
MyClass_class.prototype.HelloWorld = function(s, onsuccess, onerror) {

return jQuery.ajax({ type: "POST", url: this.url, data: {"s":s}.toJSONString(), beforeSend: function(xhr) { xhr.setRequestHeader("X-AjaxPro-Method", "HelloWorld"); if(typeof AjaxPro ! 'undefined' && AjaxPro.token ! null) xhr.setRequestHeader("X-AjaxPro-Token", AjaxPro.token); }, success: function(s) { var o = null; eval("o = " + s + ";"); if(o != null) { if(typeof o.value != "undefined" && typeof onsuccess "function") { onsuccess(o.value); return; } else if(typeof o.error != "undefined" && typeof onerror "function") { onerror(o.error); return; } } if(typeof onerror == "function") { onerror({"Message":"Failed."}); } } }); }; var MyClass = new MyClass_class();</pre>

Invoking the AjaxMethod from JavaScript

The new jQuery TypeJavaScriptProvider will generate a litte different output, and the result will be available directly. As you may remeber AjaxPro is returning on object with a property .value which will contain the result of the AjaxMethod on the server-side cocde.

The full ASPX html code will look like this:

<pre class="csharpcode"><%@ Page Language="C#" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Untitled Page</title> <script type="text/javascript" src="json.js"></script> <script type="text/javascript" src="jquery-latest.js"></script> <script type="text/javascript"> jQuery.noConflict(); </script>

</head> <body> <form id="form1" runat="server">

$(document).ready(function() { MyClass.HelloWorld("Michael Schwarz", function(res) { jQuery("#display").html(res); }); });

</script>

</form> </body> </html></pre>

To use the new jQuery provider you have to add following lines to your web.config which will disable the AjaxPro JavaScript includes and adds the use of the new jQuery JavaScript output:

<pre class="csharpcode"><ajaxNet>
<ajaxSettings>
<scriptReplacements>
<file name="prototype" path="" />
<file name="core" path="" />
<file name="converter" path="" />
</scriptReplacements>
<providers>
<typeJavaScriptProvider
type="AjaxPro.jQueryTypeJavaScriptProvider, AjaxPro.2"/>
</providers>
</ajaxSettings>
</ajaxNet></pre>

Any feedback welcome, use the comments on this page or the Google group^[3].