SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Non-Member
    Join Date
    Jan 2004
    Location
    Seattle
    Posts
    4,328
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need help making AJAX switch

    Imagine visiting a static page on a content management system (CMS) at http://MySite/World/index.php. You see a list of continents and a list of nations. Both include links to Australia...

    <a href="/World/Australia">Australia</a>

    After clicking either link, you find a page with two links, labeled "Continent" and "Nation." If a visitor wants to read about the CONTINENT of Australia, they click the Continent link, which triggers an include to another page with an article about the continent of Australia...

    include ($_SERVER['DOCUMENT_ROOT']."/articles/AusCon.php");

    If they're interested in reading about the nation, they click the Nation link, which triggers another include...

    include ($_SERVER['DOCUMENT_ROOT']."/articles/AusCon.php");

    (Or the includes could somehow target two separate articles on the same included page, perhaps stored in a PHP switch, where case = "con" or "nat.")

    Someone told me I could do this with AJAX, and that the page wouldn't have to be refreshed, wouldn't jump to another URL, etc. So I started reading my first AJAX tutorial at http://www.sitepoint.com/article/remote-scripting-ajax
    and immediately got lost.

    Can someone tell me if I'm on the right track and point me in the right direction? I've so far pasted the following into the head section of one of my pages:

    PHP Code:
    try
    {
     var 
    requester = new XMLHttpRequest();
    }
    catch (
    error)
    {
     try
     {
       var 
    requester = new ActiveXObject("Microsoft.XMLHTTP");
     }
     catch (
    error)
     {
       return 
    false;
     }
    }

    requester.open("GET""/AusCon.php");

    requester.send(null);

    requester.onreadystatechange stateHandler;



    function 
    stateHandler()
    {
     if (
    requester.readyState == 4)
     {
     if (
    requester.status == 200)
     {
       
    success();
     }
     else
     {
       
    failure();
     }
    }

    return 
    true;

    Then I created my first XML page ever at http://MySite/AusCon.php. This is all it contains:

    PHP Code:
    <?xml version="1.0" ?>
    <user>
           <name>Australia (continent)</name>
           <name2>Australia (nation)</name2>
    </user>
    When I view my page, I now see this message:

    PHP Code:
    try { var requester = new XMLHttpRequest(); } catch (error) { try { var requester = new ActiveXObject("Microsoft.XMLHTTP"); } catch (error) { return false; } } requester.open("GET""/AusCon.php"); requester.send(null); requester.onreadystatechange stateHandler; function stateHandler() { if (requester.readyState == 4) { if (requester.status == 200) { success(); } else { failure(); } } return true; } 
    Can someone tell me where I'm at, and what I need to do next to make the switches I described? Do you know of a tutorial that focuses on something more similar to what I'm trying to do?

    Also, how difficult would the following be?:

    Imagine, once again, two identical links to Australia...

    <a class="continent" href="/World/Australia">
    <a class="nation" href="/World/Australia">

    Except that one link is somehow labeled a "continent" link, the other a "nation" link. If a visitor clicks the continent link, they arrive at http://MySite/World/Australia to find the article about the Australian continent already loaded, with an invitation to load the nation article instead (via another link). If they click the nation link, they arrive to find the article about the Australian nation loaded by default, again with a link that allows them to replace it with the continent article.

    Thanks.

  2. #2
    Non-Member
    Join Date
    Jan 2004
    Location
    Seattle
    Posts
    4,328
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I just found a tutorial at http://rajshekhar.net/blog/archives/...-Tutorial.html that mentions the magic word, "link." Here's the script:

    PHP Code:
    function createRequestObject() {
        var 
    ro;
        var 
    browser navigator.appName;
        if(
    browser == "Microsoft Internet Explorer"){
            
    ro = new ActiveXObject("Microsoft.XMLHTTP");
        }else{
            
    ro = new XMLHttpRequest();
        }
        return 
    ro;
    }

    var 
    http createRequestObject();

    function 
    sndReq(action) {
        
    http.open('get''rpc.php?action='+action);
        
    http.onreadystatechange handleResponse;
        
    http.send(null);
    }

    function 
    handleResponse() {
        if(
    http.readyState == 4){
            var 
    response http.responseText;
            var 
    update = new Array();

            if(
    response.indexOf('|' != -1)) {
                
    update response.split('|');
                
    document.getElementById(update[0]).innerHTML update[1];
            }
        }

    How can this be modified so that it produces two links, pointing to, say, AusCon.php and AusNat.php?

  3. #3
    Non-Member
    Join Date
    Jan 2004
    Location
    Seattle
    Posts
    4,328
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm now offering $50 for the AJAX script I described. If anyone's interested, please see my post on the "For Hire" forum at
    http://www.sitepoint.com/forums/show...15#post2591515

    Thanks.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •