Archive for the ‘Ajax’ Category

Asynchronous Transfers (AJAX) made easy

February 1st, 2007 by Philip Hustead | Comments Off | Filed in Ajax, All

I have been doing a lot of research on AJAX and have recently purchased a WROX book called Professional AJAX (amazon).  I haven’t gotten far in the book but it starts off with a little history on AJAX starting with Google suggest.  As I read on they were talking about many different methods for pulling data asynchronously and one thing that came up was how Google Maps and Gmail uses frames.  Well this got me to thinking and I wanted to see if I could find a good way to do this using an iframe.  So this is what I came up with. 

First off I created a simple .net webservice and enabled webservices to accept HTTP-GET requests.  Then dynamiclly using javascript I created a <IFRAME> along with an event listener for its onload event to call the SomeWebserviceCall_Complete() function when the iframe is loaded.  Then I set the iframe’s src property to the webservice address with the proper attributes for the service call and this sends the HTTP-GET request through the iframe.  Because I setup the event listener on the "onload" event, once the iframe is loaded from the webservice call the SomeWebserviceCall_Complete() function is fired.

Here is the code simplified for IE:

    function SomeWebServiceCall(idParam)
    {       
        var myframe = document.createElement("iframe");
        myframe.id = ‘frameCompany’;
        myframe.style.width = ‘0px’;
        myframe.style.height = ‘0px’;  
   
        // Creates the asynchronous handler event
        myframe.attachEvent(’onload’, SomeWebServiceCall_Complete);
       
        // Calls the webservice
        myframe.src = ‘http://www.example.com/webservice?id=’ + idParam;
    }
   
    function SomeWebServiceCall_Complete()
    {
        // Parse out content from iframe
        // and use the data for whatever
       
    }

This is really easy to setup for a simple AJAX request to a web service. 

UPDATE ——————-

Here I put it into action

 <script>

    var myframe = document.createElement("iframe");
    myframe.id = ‘frameCompany’;
    myframe.style.width = ‘100px’;
    myframe.style.height = ‘100px’;
    document.getElementById(’mydiv’).appendChild(myframe);
 
   
    function SomeWebServiceCall(idParam)
    {      

        // Creates the asynchronous handler event
        myframe.attachEvent(’onload’, SomeWebServiceCall_Complete);
       
        // Calls the webservice
        myframe.src = ‘http://localhost/
                                     appname/webservice.asmx/methodname’ + idParam;
    }
   
    function SomeWebServiceCall_Complete()
    {
        //alert("did it");

        document.getElementById(’mydiv’).innerHTML += "here it is:<br />" + myframe.contentWindow.document.documentElement.innerHTML;
       
       
    }
</script>

 

This implementation just places the contents of the iframe (webservice response) into a div element on your page with an id of ‘mydiv’

JSON Documentation

January 25th, 2007 by Philip Hustead | Comments Off | Filed in Ajax, All

I have yet to find a good website on the JSON standard.  Maybe this is because the concept is not that difficult and is grasped quickly.  I have been spending a lot of time at http://www.json.org and at first found the site to be very hard to read.   I get turn off pretty quick by websites that don’t look like any time was put into them.  The more I access it though the more I am getting used to it.  I will keep trying to find a better site, or at least a better looking easier to follow site. 

Getting turned on to JSON only recently I really like working with it.  I have been using it with ASP.NET AJAX and WebServices and it is real easy to create and use.  So for those out there who are just finding out about JSON and are finding it difficult to find good documentation… don’t fret.  It’s easier then the json.org site makes it seem at first.  You can also get information on http://en.wikipedia.org/wiki/JSON but still not as detailed as I would like.  If anyone knows of any good json sites please let me know.

ASP.NET AJAX Officially Released! Sweet!!!

January 24th, 2007 by Philip Hustead | Comments Off | Filed in ASP.NET, Ajax, All

I just read the announcement from the www.asp.net website that ASP.NET AJAX 1.0 has been released.  Read more from Scott Guthrie’s Blog for details:

http://weblogs.asp.net/scottgu/archive/2007/01/23/asp-net-ajax-1-0-released.aspx

These tools have been an enormous help to me in many of my projects.  Thanks guy’s.

XML to JSON Converstion

January 24th, 2007 by Philip Hustead | Comments Off | Filed in Ajax, All

Here is a good article on converting XML to JSON using a webservice:  http://www.codeproject.com/soap/xml2json.asp

AJAX Suggest / Intellisense / Auto-complete

January 24th, 2007 by Philip Hustead | Comments Off | Filed in Ajax, All

I am working on an ASP.NET project that uses a dropdown list with so many records that it is not practical to download them all on a page load.  What I have done is created a Google Suggest like Ajax enabled dropdown that pulls records based on the first few characters entered and the number of records returned.  This makes for a much faster page load and better user experience.  I plan on writing up an article and submitting it to www.codeproject.com.  After I right it up I will post a link to it here.  Look for it in the next week….