Using Ajax.NET under SharePoint

I’m having a play with Ajax.NET because I have some somewhat unique requirements from an application which is delivered under SharePoint.

The requirement is that a process may take 1 hour to complete and the process progress is being stored in a database which must be queried.

So what my plans to do are create a Web Part which looks in the DB for these processes and refresh and image and the UI to display progress – but all without a page refresh.

Ajax.NET is the perfect solution.

When I put the CSharpSample under /_layouts/ and make the initial call:

Ajax.Utility.RegisterTypeForAjax(typeof(WebUserControl1));

I get a cast exception.

Message: Specified cast is not valid

StackTrace: at Ajax.Utility.RegisterCommonAjax() at Ajax.Utility.RegisterTypeForAjax(Type t) at CSharpSample.WebUserControl1.Page_Load(Object sender, EventArgs e) in c:\program files\common files\microsoft shared\web server extensions\60\template\layouts\csharpsample\webusercontrol1.ascx.cs:line 20

The way around this is – don’t make the RegisterTypeForAjax  call!

So you need to manually include the Ajax.NET client side references (bolded below)

Control Language=”c#” AutoEventWireup=”false” Codebehind=”WebUserControl1.ascx.cs” Inherits=”CSharpSample.WebUserControl1″ TargetSchema=”http://schemas.microsoft.com/intellisense/ie5″%>

Control Language=”c#” AutoEventWireup=”false” Codebehind=”WebUserControl1.ascx.cs” Inherits=”CSharpSample.WebUserControl1″TargetSchema=”http://schemas.microsoft.com/intellisense/ie5″%>

<script type=”text/javascript” src=”/_layouts/CSharpSample/csharpwrapper/common.ashx”>/B>script>

<script type=”text/javascript” src=”/_layouts/CSharpSample/csharpwrapper/CSharpSample.WebUserControl1,CSharpSample.ashx”>/B>script>

 

<scriptlanguage=”javascript”>

function GetTime()

{

      // Make the client side to server side call

      var res = WebUserControl1.GetPercentageComplete();

     

      // Get the value and set the width of the image      

      document.getElementById(‘progress1’).width=res.value;

 

      // TODO: Handle the 100% complete response (hide the table)   

 

      // Repeat the call every 1 second

      setTimeout(‘GetTime()’, 1000);

}

FONT color=maroon>script>

<tablewidth=”100″style=”border: solid 1px black;” cellpadding=”0″ cellspacing=”0″>

      <tr>

            <td><img src=”/_layouts/CSharpSample/images/blackpixel.gif” height=”15″ width=”0″ id=”progress1″>/FONT>td>

      /FONT>tr>

FONT color=maroon>table>

The code behind then looks like:

[Ajax.AjaxMethod]

public int GetPercentageComplete()

{

      // Go get the Percentage complete (right now just seconds)

      return(System.DateTime.Now.Second);

}

 

Other than that – Ajax.NET looks awesome.