AjaxPro and the jQuery JavaScript Provider

Because jQuery is a often used JavaScript framework I will have a provider available in the next release of Ajax.NET Professional ^[1] that will render only the wrapper JavaScript files in the jQuery ^[2] JavaScript code.

The JavaScript output for jQuery

MyAjaxClass_class = function() {};MyAjaxClass_class.prototype.url = <span class="str">'/WebSite1/ajaxpro/Default,App_Code.ashx'</span>;

MyAjaxClass_class.prototype.MyMethod = function(onsuccess, onerror) { <span class="kwrd">return</span> $.ajax({ type: <span class="str">"POST"</span>, url: <span class="kwrd">this</span>.url, data: <span class="str">"{}"</span>, beforeSend: function(xhr) { xhr.setRequestHeader(<span class="str">"X-AjaxPro-Method"</span>, <span class="str">"MyMethod"</span>); xhr.setRequestHeader(<span class="str">"X-AjaxPro-Token"</span>, AjaxPro.token); }, success: function(s) { var o = <span class="kwrd">null</span>; eval(<span class="str">"o = "</span> + s + <span class="str">";"</span>); <span class="kwrd">if</span>(o != <span class="kwrd">null</span>) { <span class="kwrd">if</span>(<span class="kwrd">typeof</span> o.<span class="kwrd">value</span> != <span class="str">"undefined"</span> &amp;&amp; <span class="kwrd">typeof</span> onsuccess <span class="str">"function"</span>) onsuccess(o.<span class="kwrd">value</span>); <span class="kwrd">else</span> <span class="kwrd">if</span>(<span class="kwrd">typeof</span> o.error != <span class="str">"undefined"</span> &amp;&amp; <span class="kwrd">typeof</span> onerror <span class="str">"function"</span>) onerror(o.error); } <span class="kwrd">if</span>(<span class="kwrd">typeof</span> onerror == <span class="str">"function"</span>) { onerror({<span class="str">"Message"</span>:<span class="str">"Failed."</span>}); } } }); };<br> var MyAjaxClass = <span class="kwrd">new</span> MyAjaxClass_class();</pre>

Maybe this will change until the release version, but it is working similar to the AjaxPro way of invoking AjaxMethods. One change here is that it will return the XmlHttpRequest object and you could cancel the request at your own.

The jQuery JavaScript Provider

The .NET C# code that will render this output looks like this:

<pre class="csharpcode"><span class="kwrd">public</span> <span class="kwrd">class</span> jQueryTypeJavaScriptProvider : TypeJavaScriptProvider
{
<span class="kwrd">public</span> <span class="kwrd">override</span> <span class="kwrd">void</span> RenderClassBegin()
{
<span class="kwrd">string</span> clientNS = GetClientNamespace();

sb.Append(clientNS); sb.Append(<span class="str">"_class = function() {};\r\n"</span>);

sb.Append(clientNS); sb.Append(<span class="str">"_class.prototype.url = '"</span> + m_URL + <span class="str">"';\r\n"</span>); }

<span class="kwrd">public</span> <span class="kwrd">override</span> <span class="kwrd">void</span> RenderClassEnd() { <span class="kwrd">string</span> clientNS = GetClientNamespace();

sb.Append(<span class="str">"var "</span>); sb.Append(clientNS); sb.Append(<span class="str">" = new "</span>); sb.Append(clientNS); sb.Append(<span class="str">"_class();\r\n\r\n"</span>); }

<span class="kwrd">public</span> <span class="kwrd">override</span> <span class="kwrd">void</span> RenderMethods(List&lt;MethodInfo&gt; methods) { <span class="kwrd">string</span> clientNS = GetClientNamespace();

<span class="kwrd">for</span> (<span class="kwrd">int</span> i = 0; i &lt; methods.Count; i++) { MethodInfo method = methods[i]; <span class="kwrd">string</span> methodName = GetClientMethodName(method); ParameterInfo[] pi = method.GetParameters();

sb.Append(clientNS + <span class="str">"_class.prototype."</span>); sb.Append(methodName); sb.Append(<span class="str">" = function("</span>);

<span class="kwrd">for</span> (<span class="kwrd">int</span> p = 0; p &lt; pi.Length; p++) { sb.Append(pi[p].Name); }

sb.Append(<span class="str">"callback) {\r\n"</span>);

sb.Append(<span class="str">@" return $.ajax({ type: "</span><span class="str">"POST"</span><span class="str">", url: this.url, data: "</span><span class="str">"{}"</span><span class="str">", beforeSend: function(xhr) { xhr.setRequestHeader("</span><span class="str">"X-AjaxPro-Method"</span><span class="str">", "</span><span class="str">""</span> + methodName + <span class="str">@""</span><span class="str">"); xhr.setRequestHeader("</span><span class="str">"X-AjaxPro-Token"</span><span class="str">", AjaxPro.token); }, success: function(s) { var o = null; eval("</span><span class="str">"o = "</span><span class="str">" + s + "</span><span class="str">";"</span><span class="str">"); if(o != null) { if(typeof o.value != "</span>undefined<span class="str">" &amp;&amp; <br> typeof onsuccess "</span>function<span class="str">") onsuccess(o.value); else if(typeof o.error != "</span>undefined<span class="str">" &amp;&amp; <br> typeof onerror "</span>function<span class="str">") onerror(o.error); } if(typeof onerror == "</span>function<span class="str">") { onerror({"</span>Message<span class="str">":"</span>Failed.<span class="str">"}); } } }); "</span>);

sb.Append(<span class="str">"};\r\n"</span>);

<span class="rem">//if (i &lt; methods.Count - 1)</span> <span class="rem">// sb.Append(",");</span> } } }</pre>

There will be a new setting in web.config where you can configure which provider you want to use, one of the built-in providers or your own. With the scriptReplacements settings you can disable the core, prototype and converter JavaScript files, and then you are ready to use it without any JavaScript code built by AjaxPro.

I hope that this will help developers to use AjaxPro with any JavaScript framework.