Apr 16, 2012

COMET or Reverse Ajax

This concept is the solution of problem that,


How to send data from a server to a client without a native HTTP request made by client.This can be implemented in Chatting Applications, Automatic updates of some data.


So what is this ? 
Comet is a programming technique that enables web servers to send data to the client without having any need for the client to request it. It allows creation of event-driven web applications which are hosted in the browser.
Try reading from this . http://en.wikipedia.org/wiki/Comet_%28programming%29

From where do i got to know of this is http://stackoverflow.com/questions/3226688/web-chat-application-asp-net-jabber-ajax-wcf-comet-reverseajax-issues-faced

Here is finally wot i got and believe me its Awesome :)


1. create a new c# web application
2. Add a new page name it Services.aspx
3. in the code file i.e. Services.aspx.cs add the following code.
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class Service : System.Web.UI.Page 
{
    public static string Delimiter = "|";

    protected void Page_Load(object sender, EventArgs e)
    {
        Response.Buffer = false;

        while (true)
        {
            Response.Write(Delimiter + DateTime.Now.ToString("HH:mm:ss.FFF"));
            Response.Flush();

            // Suspend the thread for 1/2 a second
            System.Threading.Thread.Sleep(500);
        }

        // Yes I know we'll never get here, it's just hard not to include it!
        Response.End();
    }
}

4. Good Now add a html page say home.html and add this code to it.


<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Comet AJAX Sample</title>
    
    <script language="javascript">
      function getData()
      {
          loadXMLDoc("Service.aspx");
      }
        
      var req = false;
        
      function createRequest()
      {
        // branch for native XMLHttpRequest object
        if(window.XMLHttpRequest && !(window.ActiveXObject))
        {
          try {
            req = new XMLHttpRequest();
          } catch(e) {
   req = false;
          }
        // branch for IE/Windows ActiveX version
        } else if(window.ActiveXObject) {
          try {
            req = new ActiveXObject("Msxml2.XMLHTTP");
          } catch(e) {
            try {
       req = new ActiveXObject("Microsoft.XMLHTTP");
       } catch(e) {
       req = false;
            }
     }
        }
      }
        
      function loadXMLDoc(url) {
          try
          {
              if (req) {
                  req.abort();
                  req = false;
              }             
                
              createRequest();
              
              if (req) {
            req.onreadystatechange = processReqChange;
            req.open("GET", url, true);
            req.send("");
         }
         else {
             alert('unable to create request');
         }
     }
     catch (e) {
         alert(e.message);
     }
      }
        
      function processReqChange() {
          if (req.readyState == 3) {
              try
              {
                  ProcessInput(req.responseText);
                    
                  // At some (artibrary) length 
                  // recycle the connection
                  if (req.responseText.length > 3000) {
                      lastDelimiterPosition = -1;
                      getData();
                  }
              }
              catch (e) {
                  alert(e.message);
              }
          }
      }
        
      var lastDelimiterPosition = -1;
        
      function ProcessInput(input)
      {
          // Make a copy of the input
          var text = input;
          // Search for the last instance of the delimiter
          var nextDelimiter = 
                text.indexOf('|', lastDelimiterPosition+1);
          if (nextDelimiter != -1) {
              // Pull out the latest message
              var timeStamp = text.substring(nextDelimiter+1);
              if (timeStamp.length > 0) {
                  lastDelimiterPosition = nextDelimiter;
                  ProcessTime(timeStamp);
              }
          }
      }
        
      function ProcessTime(time)
      {
          var out = document.getElementById('outputZone');
          out.innerHTML = time;
      }
    </script>
</head>
<body onload="getData()">
    <b>Server Time:</b>&nbsp;&nbsp;<span id="outputZone"></span>
</body>
</html>

5. And yes you have done it Now run your html page.

You will see that the time is Continuously updating and yeah this is server time also check out that the browser is not sending any AJAX requests.


Apr 14, 2012

Adding a custom control Dynamically to a page in ASP.NET

Adding a custom control Dynamically to a page in ASP.NET

1. Create a control .ascx file into your project Header.ascx (say).

2. Then add a refrence to your control

<%@ Reference Control="~/modules/controls/Header.ascx"%>


3. Then in C# use below code
     (controls are listed in ASP namespace)
ASP.Header header_ctrl= (ASP.Header)LoadControl("~/Header.ascx"); 
Placeholder.Controls.Add(header_ctrl); 

here  Header is custom control and Placeholder is a panel.