Thursday, September 18, 2008

AJAX enabling an existing ASP.Net WebSite

When I wanted to use AJAX in an existing ASP.Net website - I had no idea about how I would go about doing this. Turns out it is pretty simple.

The first thing you need to do is install Microsoft ASP.NET AJAX 1.0. Also if you wish you can install the MS AJAX Control Toolkit. (version for VS 2005 - release 11119)

The main part that you need to fix is your existing web.config file so that it includes a reference to the System.Web.Extensions dll - which is essential for ASP AJAX. The other changes are needed to configure AJAX as well as tell the ASP engine how to handle incoming requests (HTTPHandlers and HTTPModules sections).

Here we go.....

Add the following code into the Web.Config file inside the <configSections> section. (If you dont have one - you need to create it under the section of the <configuration> web.config.[1] (The number represents where in the entire body of the web.config the section should appear - see the last code section below).

<sectionGroup name="system.web.extensions" type="System.Web.Configuration.SystemWebExtensionsSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
    <sectionGroup name="scripting" type="System.Web.Configuration.ScriptingSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
        <section name="scriptResourceHandler" type="System.Web.Configuration.ScriptingScriptResourceHandlerSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/>
        <sectionGroup name="webServices" type="System.Web.Configuration.ScriptingWebServicesSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
            <section name="jsonSerialization" type="System.Web.Configuration.ScriptingJsonSerializationSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="Everywhere" />
            <section name="profileService" type="System.Web.Configuration.ScriptingProfileServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication" />
            <section name="authenticationService" type="System.Web.Configuration.ScriptingAuthenticationServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication" />
        </sectionGroup>
    </sectionGroup>
</sectionGroup>

Next under <assemblies> section add the following code: (the assemblies section appears under <configuration><compilation> section).[2]

<add assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

Next add the following HTTPHandlers[3]  and HTTPModules[4] section under the section <system.web>.

<httpHandlers>
      <add verb="GET" path="CrystalImageHandler.aspx" type="CrystalDecisions.Web.CrystalImageHandler, CrystalDecisions.Web, Version=10.2.3600.0, Culture=neutral, PublicKeyToken=692fbea5521e1304"/>
      <remove verb="*" path="*.asmx"/>
      <add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      <add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      <add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>
</httpHandlers>
<httpModules>
      <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
</httpModules>

Finally add the following <system.webServer> section under the <configuration> section.[5]

<system.webServer>
   <validation validateIntegratedModeConfiguration="false"/>
   <modules>
     <add name="ScriptModule" preCondition="integratedMode" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
   </modules>
   <handlers>
     <remove name="WebServiceHandlerFactory-Integrated" />
     <add name="ScriptHandlerFactory" verb="*" path="*.asmx" preCondition="integratedMode"
          type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
     <add name="ScriptHandlerFactoryAppServices" verb="*" path="*_AppService.axd" preCondition="integratedMode"
          type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
     <add name="ScriptResource" preCondition="integratedMode" verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
   </handlers>
 </system.webServer>

That is it - you will now be able to use MS AJAX in your existing ASP website project.

Here is the basic skeleton of the Web.Config file into which the above pieces need to be plugged in. (I figured that you might not have all the sections that I have talked about above and this will show you where they go under the configuration item).

<?xml version="1.0"?> <configuration> <configSections> <!--Add Section Group Here-->[1] </configSections> <system.web> <compilation debug="false"> <assemblies> <!--Add assembly reference to System.Web.Extensions here-->[2] </assemblies> </compilation>

 

<httpHandlers> <!--Add HTTP Handlers here-->[3] </httpHandlers> <httpModules> <!--Add script module here-->[4] </httpModules> </system.web> <system.webServer> <!-- add system.webserver items here-->[5] </system.webServer> </configuration>

No comments: