2009

Adding and Using an Ajax Handler

This topic takes the Hello World custom control example and adds a handler class for using AJAX calls.

Two things are needed:

  • A new public class in the HelloWorld namespace
  • An IHttpHandler definition within the new class

Adding the AJAX Handler Class

  1. Create a new C# code file named Handler.cs.
  2. Add references to SourceCode.Forms.Controls.Web.SDK.Attributes and the .Net System.Web namespaces.
  3. Add a ClientAjaxHandler to the CustomControls.HelloWorld namespace, as shown in the sample code below:
    Copy

    Example ClientAjaxHandler

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Web;

    // SourceCode namespaces used in the control
    using SourceCode.Forms.Controls.Web.SDK.Attributes;

    // Adding the AJAX Handler Class
    // This topic takes the Hello World custom control example and adds a handler class for using AJAX calls.
    // Two things are needed:
    // - A new public class in the HelloWorld namespace
    // - An IHttpHandler definition within the new class

    namespace CustomControls.HelloWorld
    {

        [ClientAjaxHandler("HelloWorld.handler")]
        public class Handler : IHttpHandler
        {
            bool IHttpHandler.IsReusable
            {
                get
                {
                    return true;
                }
            }

            void IHttpHandler.ProcessRequest(HttpContext context)
            {
                string name = context.Request.QueryString["name"];
                if (string.IsNullOrEmpty(name))
                    name = "(Unknown)";

                context.Response.Write(string.Format("Hello {0}, {1}", name, DateTime.Now.ToString("o")));
            }
        }
    }
  4. Give the ClientAjaxHandler a virtual path (pseudoname). This will be interpreted by SmartForms and will be used to map all requests to the handler.
  5. Create a public class for the IHttpHandler
  6. Add a reusable IHttpHandler Boolean call from the System.Web namespace.
  7. Add a ProcessRequest to use the content of IHttpHandler call.
  8. Create a process for managing the request data. In this example we search for a property called "name" and then write a greeting based on the value returned.
  9. Build the updated assembly.
  10. To test this example, open an internet browser and call the handler from the SmartForms site. i.e. forms:81/Designer/Runtime/a/1/c/2/HelloWorld.handler.
  11. Examine the html returned (view source) and you will see the Hello (Unknown) response.

Using the Ajax Handler

The Ajax Handler can now be used on the client side, for example, by using a jQuery function.

The javascript example below will simply call the Ajax handler.

Copy

JavaScript example calling the Ajax handler

// The Ajax Handler can now be used on the client side, for example, by using a jQuery function.
// The javascript example below will simply call the Ajax handler.

// Using the AJAX Handler
(function ($, undefined) {
    $(document).ready(function () {

        // Use event delegation
        $(document).delegate('.SFC.CustomControls-HelloWorld-Control', 'click.HelloWorldExample', function (e) {
            var target = this;

            $.ajax({
                url: 'HelloWorld.handler',
                cache: false,
                dataType: 'text'
            }).done(function (text) {
                target.innerHTML = text;
            });
        });
    });
})
    (jQuery);