#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2003
    Posts
    258
    Rep Power
    13

    Using js/ajax for time-delayed event


    I'm trying to load a simple page which after a certain amount of time, opens a new small window which runs in the background.

    I've tried to piecemeal some scripts but I'm just not well versed enough in js to make sense of what I'm doing...

    I know I need to make use of
    Code:
    XMLHttpRequest
    and so I thought I was heading down the right path with something like:

    Code:
    var oRequest = new XMLHttpRequest();
    var sURL = "http://www.yahoo.com";
    
    oRequest.open("GET",sURL,false);
    oRequest.setRequestHeader("User-Agent",navigator.userAgent);
    oRequest.send(null)
    
    if (oRequest.status==200) alert(oRequest.responseText);
    else alert("Error executing XMLHttpRequest call!");
    but not so much...I can't get that to load even WITHOUT a timed delay....?
  2. #2
  3. No Profile Picture
    Lost in code
    Devshed Supreme Being (6500+ posts)

    Join Date
    Dec 2004
    Posts
    8,317
    Rep Power
    7170
    When you're working with AJAX it's worth pulling in the jQuery library simply to give you a sane interface for using XMLHttpRequest.

    With jQuery your code could be as simple as:
    Code:
    var sURL = '...';
    $.get(sURL, function(text) {
      alert(text);
    });
    However, note that the URL you request has to be on the same domain as the JavaScript file. You would not be able to request www.yahoo.com unless your JavaScript file were hosted on www.yahoo.com.

    Your original code does not work (possibly among other reasons) because your code for handling the result needs to be put into a function and bound to one of the events triggered by the XMLHttpRequest. You can't execute it immediately after the call to send because the HTTP request is run asynchronously and will not have completed yet.
    PHP FAQ

    Originally Posted by Spad
    Ah USB, the only rectangular connector where you have to make 3 attempts before you get it the right way around
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2003
    Posts
    258
    Rep Power
    13
    Originally Posted by E-Oreo
    When you're working with AJAX it's worth pulling in the jQuery library simply to give you a sane interface for using XMLHttpRequest.

    With jQuery your code could be as simple as:
    Code:
    var sURL = '...';
    $.get(sURL, function(text) {
      alert(text);
    });
    However, note that the URL you request has to be on the same domain as the JavaScript file. You would not be able to request www.yahoo.com unless your JavaScript file were hosted on www.yahoo.com.

    Your original code does not work (possibly among other reasons) because your code for handling the result needs to be put into a function and bound to one of the events triggered by the XMLHttpRequest. You can't execute it immediately after the call to send because the HTTP request is run asynchronously and will not have completed yet.
    OK...well I tried this:
    Code:
    function XMLHttpRequestDemo() {
     var oRequest = new XMLHttpRequest();
     var sURL  = "http://"+self.location.hostname+"/test/somefile.txt";
    
     oRequest.open("GET",sURL,false);
     oRequest.setRequestHeader("User-Agent",navigator.userAgent);
     oRequest.send(null)
    
     if (oRequest.status==200) alert(oRequest.responseText);
     else alert("Error executing XMLHttpRequest call!");}
    and then
    Code:
    <body onload="XMLHttpRequestDemo()">
    And it works...but my questions are:

    1) How can I make it so that rather than have an alert box pop up with the info, I open a new window perhaps in the background.

    2) How can I make it so that it only happens say 100 seconds after the initial page loads?
  6. #4
  7. --
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2012
    Posts
    3,959
    Rep Power
    1014
    Hi,

    the code you copypasta'd is terrible. What it does is block the whole website including all user interaction until the Ajax request is completed. Your users will think they're back in the 90s, surfing the Internet with some 56k modem.

    If you like nostalgia, go ahead. Ignore what the people around here tell you and instead steal garbage code from the Internet. But if you wanna write a modern website that's actually usuable, then listen to E-Oreo and use a JavaScript library. Seriously. That's the only sane way to achieve what you want.
    Last edited by Jacques1; July 16th, 2013 at 03:21 PM.
    The 6 worst sins of security ē How to (properly) access a MySQL database with PHP

    Why canít I use certain words like "drop" as part of my Security Question answers?
    There are certain words used by hackers to try to gain access to systems and manipulate data; therefore, the following words are restricted: "select," "delete," "update," "insert," "drop" and "null".
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2003
    Posts
    258
    Rep Power
    13
    Originally Posted by Jacques1
    Hi,

    the code you copypasta'd is terrible. What it does is block the whole website including all user interaction until the Ajax request is completed. Your users will think they're back in the 90s, surfing the Internet with some 56k modem.

    If you like nostalgia, go ahead. Ignore what the people around here tell you and instead steal garbage code from the Internet. But if you wanna write a modern website that's actually usuable, then listen to E-Oreo and use a JavaScript library. Seriously. That's the only sane way to achieve what you want.
    You guys are right...I think I just stuck with what I found that I could make work rather than doing it properly...

    So I think I'm almost there with this but of course I'm clearly not well versed:
    Code:
    $(document).ready(function()
    {
    window.setTimeout(function()
    {
    var sURL = 'sometext.txt';
    $.get(sURL, function(text) {
      alert(text);
    });
    
    }, 1500);
    });
    But rather than the alert, and this is probably a very basic js question...but how do I make it a pop under new window?
  10. #6
  11. --
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2012
    Posts
    3,959
    Rep Power
    1014
    This looks a lot better.

    Originally Posted by mytwocents
    But rather than the alert, and this is probably a very basic js question...but how do I make it a pop under new window?
    Don't. The era of pop up windows is over. They've been abused so heavily that any sane browser will simply refuse to execute the JavaScript command. And they just suck, because they're patronizing. Who are you to open new browser windows without asking the user? It's up to them how they use their browser and when they open a new tab or window.

    If this is gonna be an internal website for a small audience, then maybe this is an option. But for any public website, pop ups are a no-go and will make your precious application look like a scamsite. Instead, use one of the many dialog plugins for jQuery.

    For the sake of completeness, windows are opened with window.open() (not too surprising).
    The 6 worst sins of security ē How to (properly) access a MySQL database with PHP

    Why canít I use certain words like "drop" as part of my Security Question answers?
    There are certain words used by hackers to try to gain access to systems and manipulate data; therefore, the following words are restricted: "select," "delete," "update," "insert," "drop" and "null".

IMN logo majestic logo threadwatch logo seochat tools logo