Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    Regular Coder ajetrumpet's Avatar
    Join Date
    Jul 2009
    Location
    Iowa City, IA
    Posts
    407
    Thanks
    44
    Thanked 5 Times in 5 Posts

    using AJAX and the XMLhttprequest

    hello all,

    I am trying to see if the w3schools example works on my site with a collapsible panel. here is what I have:
    Code:
    <script type="text/javascript">
    function getXMLcontent() {
    if (window.XMLHttpRequest)
      
      xmlhttp=new XMLHttpRequest();
      }
    else
      {
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
      
      	document.getElementById('CollapsiblePanel1').style.visibility = 'visible';
    	document.getElementById("CollapsiblePanelContent").innerHTML=xmlhttp.responseText;
      	xmlhttp.open("GET","showfunction.php?fname=" + document.getElementById('functions').value, true);
    	xmlhttp.send();
    	alert("showfunction.php?fname=" + document.getElementById('functions').value);
    }
    </script>
    the panel shows up as a thin grey line because no text is being thrown into it from the 'responsetext' property. I don't really know anything about what I'm doing. Just trying to copy and paste what the website example is. is there anything else I should know about what I'm doing, that would at least tell me why I'm not getting the data back out of the server like I should be?

    the 'functions' element on the page is a dropdown box, but it is not inside of a form tag. does that make a difference since I am using 'GET'??

    thanks!

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,436
    Thanks
    75
    Thanked 4,372 Times in 4,337 Posts
    Go read the w3schools stuff again.

    You can't get the responseText *BEFORE* the send!!!

    Further, if you use true as the last argument to open( ), you *MUST* set up a response *HANDLER*, which you haven't even started to do.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Regular Coder ajetrumpet's Avatar
    Join Date
    Jul 2009
    Location
    Iowa City, IA
    Posts
    407
    Thanks
    44
    Thanked 5 Times in 5 Posts
    that works fine Pedant. this fits the need:
    Code:
      	document.getElementById('CollapsiblePanel1').style.visibility = 'visible';
      	xmlhttp.open("GET","showfunction.php?fname=" + document.getElementById('functions').value, false);
    	xmlhttp.send();
    	alert(document.getElementById("CollapsiblePanelContent").innerHTML=xmlhttp.responseText);

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,436
    Thanks
    75
    Thanked 4,372 Times in 4,337 Posts
    Yep. Using false as the last argument means "wait for the response", so then you don't have to have the event handler.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    Regular Coder ajetrumpet's Avatar
    Join Date
    Jul 2009
    Location
    Iowa City, IA
    Posts
    407
    Thanks
    44
    Thanked 5 Times in 5 Posts
    I don't have the knowledge right now to be dealing with event handlers. so yeah, thanks again for the help sir!

    one more question if you don't mind: does this request-type AJAX code only work with an actual page? for instance, do I have to use something like showfunction.php?fname=myfunction to get the content out of the db, or can I pull the content out without using a page URL? I don't really understand this concept.

    Can you offer an explanation or two?

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,436
    Thanks
    75
    Thanked 4,372 Times in 4,337 Posts
    You *MUST* pass a URL.

    What you are *ACTUALLY* doing is making exactly the same kind of HTTP Request that a browser makes when you ask the browser to load such a page.

    In fact, try that yourself: In the browser's address bar, type in
    Code:
      http://www.yoursite.com/showfunction.php?fname=whatever
    and look what comes back from the server!

    *THAT* is 100% identical to what comes back from the server to the responseText property when you use the AJAX call.

    So you *can* read ANY page (php, html, whatever) off of your own site using AJAX coding this way.

    The whole point is to create a special page that returns just exactly what your AJAX code wants/needs for its purpose.

    There's really nothing magic: It's just that XMLHTTP object acting as a sort of mini-browser to go out and get the URL you asked for.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    ajetrumpet (11-11-2010)

  • #7
    Regular Coder ajetrumpet's Avatar
    Join Date
    Jul 2009
    Location
    Iowa City, IA
    Posts
    407
    Thanks
    44
    Thanked 5 Times in 5 Posts
    Pedant,

    is this the only technique that is available by the AJAX language?

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,436
    Thanks
    75
    Thanked 4,372 Times in 4,337 Posts
    Sorry...don't understand the question.

    Oh, and AJAX isn't a language. It is, itself, just a "technique".

    Technically, what you used wasn't AJAX.

    AJAX is just an acronym: Asynchronous Javascript And Xml.

    What you did was use a synchronous call. So I guess we could name it SJAX.

    Except what you returned to yourself wasn't XML. It was just text. So maybe it should be called SJAT?

    But everybody tosses async and sync and xml and text all together as AJAX. Just to confuse the issue? Or maybe oversimplify it. Whatever.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    Regular Coder ajetrumpet's Avatar
    Join Date
    Jul 2009
    Location
    Iowa City, IA
    Posts
    407
    Thanks
    44
    Thanked 5 Times in 5 Posts
    the question is: what did I learn how to do on w3schools? use a call? is that kind of "process" called "AJAX"? as in, is that what it's all about? if so, then the answer is yes. and if so, AJAX is really nothing, just a technology developed by another developer.

  • #10
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,436
    Thanks
    75
    Thanked 4,372 Times in 4,337 Posts
    Quote Originally Posted by ajetrumpet View Post
    AJAX is really nothing, just a technology developed by another developer.
    You got it.

    Long before the XMLHTTP object appeared in browsers, and even before <iframe>s, I used to accomplish this same thing using <frame>s.

    I would have a main visible frame that would ask for a particular URL to be put into another completely hidden frame. That URL would return a page that had no important content *other* than JavaScript, and the JavaScript would be used to modify the contents of the visible frame.

    Then I got a little more clever: I created a "callback" function in the main frame with a standard name. And then the code loaded into the hidden frame would, instead of directly modifying the main frame, call that callback function when it got loaded, passing a reference to a set of returned data (typically a JavaScript array of objects).

    Please tell me how this differs, in concept, from AJAX used with JSON today?

    Actually, I still often use this technique, today, when I want to send <form method=post> data to the server. It is *SO* much easier to just use
    <form target="iframeName" method="post" action="processFormAndRespond.xxx">
    than it is to build up an AJAX request. So why bother? I accomplish the same thing with less work. I now use <iframe>s, but other than that my technique hasn't changed much since 1998.

    But don't say that a technology like AJAX is "nothing". By making it somewhat of a standard, companies such as Google can develop entire products that can be delivered via the web.
    Last edited by Old Pedant; 11-12-2010 at 07:44 PM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

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