SitePoint Sponsor

User Tag List

Results 1 to 22 of 22
  1. #1
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Timeout and redirect

    I trying to get a DIV to show up, after the timeout disappear, and when it disappears, the user gets redirected to another page. I need the redirection to page to be setup on the DIV HTML line. The script can be called from there to.
    This is what I have. It is a collection of ideas from different authors:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=windows-1250">
    <meta name="generator" content="PSPad editor, www.pspad.com">
    <title></title>

    <script type="text/javascript">

    $('#msg').ready(function () {
    setTimeout(function () {
    $('#msg').hide();
    window.location.href = 'index.php';
    }, 3000);
    });

    </script>

    <style>
    .hide {
    display:none;
    }

    .show {
    display:block;
    }
    /* Information-Success */
    .infobox{
    position: absolute;
    top:50%;
    bottom: 0;
    margin-left: 30%;
    margin-right: 30%;
    width: 40%;
    height:50px;
    padding-top: 5px;
    border:solid 1px #008800;
    background:#D5FFC6;
    color:#48A41C;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
    font-weight:normal;
    text-align:center;
    }

    /* Error */
    .errorbox{
    position: absolute;
    top:50%;
    bottom: 0;
    margin-left: 30%;
    margin-right: 30%;
    width: 40%;
    height:50px;
    padding-top: 5px;
    border:solid 1px #880000;
    background:#FDE4E1;
    color:#CB4721;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
    font-weight:normal;
    text-align:center;
    }
    </style>

    </head>
    <body>
    <div id="msg" class = "infobox">You have selected The Info Box</div>
    </body>
    </html>

    Right now the way it is, is not hiding and not redirecting. Can someone help?

    Thank You

  2. #2
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    You need to include jquery before your JS code
    HTML Code:
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

  3. #3
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank You I did it, and now is timing out and redirecting. Now, how can I include the page to redirect to on the DIV tag?

  4. #4
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    You mean add a HTML link inside the div? Something like this:
    HTML Code:
    <a href="index.php">Link text here</a>

  5. #5
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I mean change the index.php in the script to what ever I need at the DIV loading

  6. #6
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Change this line here:
    Code JavaScript:
    window.location.href = 'index.php';

  7. #7
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I mean change it at the DIV loading...

    or call the script from the DIV like this:

    <div onload = CallTheFunction('pageToGoTo.php)>message to display in the Div</div>

  8. #8
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    I'm not sure what you're trying to achieve.. divs don't fire an onload event, and your code already runs once the page has been loaded.

  9. #9
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't need an onload event on DIV (I though it had it). All I need is something to call that loads a DIV, changes the Div content, Wait xxx milliseconds to timeout, and at the end of the timeout redirects the user to another page (or not). Basically is a kind of alert that stays on for enough time for the user to read the message and takes him/her to a page to correct the error or to proceed the operation. I think I made myself clear, I hope.

  10. #10
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    OK, I understand what you're trying to do now.. so, how about something like this:
    HTML Code:
    <body>
        <a href="#">Demo the message</a>
        <div id="msg" class="hide"></div>
    
        <script type="text/javascript">
            var doRedirect = function(location, message, type) {
                var msgClass = ''
                if (type && type == 'success') {
                    msgClass = 'infobox';
                } else if (type && type == 'error') {
                    msgClass = 'errorbox';
                }
                
                $('#msg').html(message).addClass(msgClass).show();
                
                setTimeout(function () {
                    window.location.href = location;
                }, 3000);
            };
            $('a').click(function(e){
                e.preventDefault();
                doRedirect('index.php', 'Thanks for registering', 'success');
            });
        </script> 
    </body>
    Here I've written function called doRedirect which takes 3 params: the url you want to redirect to, the message you want to display, and the type of msg (success or error). I've added a link in the page which you can click to see a demonstration of the code in action.. but in your own pages, you can call doRedirect however you want. Note that the div is now hidden by default.

  11. #11
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That looks good. But I can't call it from a link. It is to be called from a php script with echo.
    You said 'divs don't fire an onload event' but you can use the jQuery .ready which is almost the same, or it is not?.

    Can't we use ----$('#msg').ready(function () {[code]---- instead of ----$('a').click(function(e){----- ?

    I just want to get this alert for my error messages, or information to the user. PHP header(location works fine but in some scripts I have the headers sent before, so I'm dead...

    Sorry for the poor formatted code but I can't find the tags for the code in the post

  12. #12
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by reisve View Post
    I can't call it from a link. It is to be called from a php script with echo.
    So, if I understand this correctly, you're coming from another page to this one, which is purely to display a message to the user before redirecting to another page? If that's the case you really don't need javascript at all.. just output your page with your message div and this tag inside the <head> section of your page:
    HTML Code:
    <meta http-equiv="refresh" content="5;URL=index.php">
    (with 5 being the number of seconds the page is displayed for before redirecting).

    Quote Originally Posted by reisve View Post
    You said 'divs don't fire an onload event' but you can use the jQuery .ready which is almost the same, or it is not?
    jquery's .ready() function executes the code once the page has finished loading. If you need to do that, it's common to call it on the document object, like this:
    Code JavaScript:
    $(document).ready(function() {
      // Handler for .ready() called.
    });
    http://api.jquery.com/ready/

  13. #13
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is what I had before:

    the 'message' page:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <base href ="http://root.com/divdev/">
    <link rel="stylesheet" type="text/css" href="css/frontend.css">
    <meta http-equiv="Content-Type" content="text/html; charset=Western (ISO-8895-1)" />
    <?php
    $page = $_GET["page"];
    echo "<meta http-equiv=\"refresh\" content=\"3;URL='$page'\">";
    ?>
    <title>Teste</title>
    </head>
    <body>
    <div class = "errorbox">
    <?php
    $msg = $_GET["msg"];
    echo $msg;
    ?>
    </div>
    </body>
    </html>

    and call it from php:

    $msg = "message";
    $page = "index.php";
    header(location: error.php?msg=$msg&page=$page);

    more or less. I remove this already. The problem is sending the header after, echoing a message.

    How do I format the code in the post???

  14. #14
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by reisve View Post
    How do I format the code in the post???
    You have to enclose your code in tags like this: [html]your code[/html]

    Well, from what you posted above, your error.php page looks ok and should work.. although it's not a good idea to output $_GET variables without sanitising them first. Sounds like the error is on the previous page, where you are calling header() from. You have to call header() before you output anything from your script.. what else does the previous page do?

  15. #15
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    the error is on the page from where I'm calling the error.php from

    [QUOTE=fretburner;5459760]You have to call header() before you output anything from your script[QUOTE] That is my problem. in some situations that is not possible. That is why I'm looking for this DIV alternatif

  16. #16
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Whatever you do on your error.php isn't going to prevent the error, because that page isn't using the header() function to do the redirect.

    There should always be a way you can rearrange your logic to avoid the problem - do you have an example of a situation where you're finding it difficult to do so?

  17. #17
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    before that, let me show you your code, with a change and ask you a question

    The code:

    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      <meta http-equiv="content-type" content="text/html; charset=windows-1250">
      <meta name="generator" content="PSPad editor, www.pspad.com">
      <title></title>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript">
            var doRedirect = function(location, message, type) {
                var msgClass = ''
                if (type && type == 'success') {
                    msgClass = 'infobox';
                } else if (type && type == 'error') {
                    msgClass = 'errorbox';
                }
                
                $('#msg').html(message).addClass(msgClass).show();
                
                setTimeout(function () {
                    window.location.href = location;
                }, 3000);
            };
                $('#msg').ready(function () {
                doRedirect('index.php', 'Thanks for registering', 'success');
            });
        </script> 
      <body>
        <div id="msg" class = "hide"></div>  
        </body>
      </html>
    The question:

    Can I call the function from inside the div? If I can do that the problem is solved.

    The code you asked:

    PHP Code:
    <?php
      
    include "lib/configuration.php";
      include 
    "language/frontend/portuguese.php";

      if (isset(
    $_SESSION['logedin'])) {
      if (
    $_POST) {
        
    $comp_cat $_POST['category']; 
        
    $comp_name $_POST['company']; 
        
    $comp_link $_POST['link']; 
        
    $comp_desc $_POST['description']; 
        
    $comp_addr $_POST['address']; 
        
    $comp_county $_POST['county']; 
        
    $comp_city $_POST['city']; 
        
    $comp_state $_POST['state']; 
        
    $comp_country $_POST['country']; 
        
    $comp_phone $_POST['phone']; 
        
    $comp_fax $_POST['fax']; 
        
    $comp_email $_POST['email']; 
        
    $comp_duration $_POST['duration']; 
        
    $comp_date date("Y-m-d");

        
    $comp_logo $_FILES['file']['name'];
        
    $ext substr($comp_logostrpos($comp_logo,'.'), strlen($comp_logo)-1);

        if(!
    in_array($ext$allowed_filetypes)) {
          
    $msg "";
          
    $msg $addlinkerror['filetype'] . "</br>";
        }

        if(
    filesize($_FILES['file']['tmp_name']) > $max_filesize) {
          
    $msg .= $addlinkerror['filesize'] . "</br>";
        }
            
        if(!
    is_writable($upload_path)){
          
    $msg .= $addlinkerror['writabledir'];
        }

        if (
    $msg <> "") {
          echo 
    "<div class = 'errorbox'>" $msg "</div>";
        }

        if(
    move_uploaded_file($_FILES['file']['tmp_name'],$upload_path $comp_logo)) {

          
    $link mysqli_connect($host$user$pass$db);
          
          
    /* check connection */
          
    if (mysqli_connect_errno()) {
            echo 
    "<div class = 'errorbox'>" $error['dbconnection'] . "</div>";
          }
       
          
    $query "INSERT INTO links (comp_cat, comp_name, comp_link, comp_desc, comp_addr, comp_county, comp_city, comp_state, comp_country, comp_phone, comp_fax, comp_email, comp_duration, comp_date, comp_logo) VALUES (?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)"
          
    $stmt mysqli_prepare($link$query);
          
    mysqli_stmt_bind_param($stmt"issssssssssssss"$comp_cat$comp_name$comp_link$comp_desc$comp_addr$comp_county$comp_city$comp_state$comp_country$comp_phone$comp_fax$comp_email$comp_duration$comp_date$comp_logo);

          
    /* Execute the statement */
          
    mysqli_stmt_execute($stmt);
      
          if (
    mysqli_stmt_errno($stmt)) {
            echo 
    "<div class = 'errorbox'>" $addlinkerror['upload'] . "</div>";
          } else {
            echo 
    "<div class = 'infobox'>" $addlinkinfo['uploaded'] . "</div>";
          }

          
    /* close statement */
          
    mysqli_stmt_close($stmt);
      
          
    /* close connection */
          
    mysqli_close($link);
        }
      } else {
        include 
    "templates/frontend/header.tpl";
        include 
    "templates/frontend/loginspace.tpl";
        include 
    "templates/frontend/registerlogin.tpl";
        include 
    "templates/frontend/searchspace.tpl";
        include 
    "templates/frontend/search.tpl";
        include 
    "templates/frontend/hmenuspace.tpl";
        include 
    "templates/frontend/menubar.tpl";
        include 
    "templates/frontend/leftspace.tpl";
        include 
    "templates/frontend/leftside.tpl";
        include 
    "templates/frontend/contentspace.tpl";
      
        if (isset(
    $_SESSION['logedin'])) {
          include 
    "templates/frontend/addlink1.tpl";
        } else {
          
    $msg $addlinkerror['login'];
          
    $page '../../index.php';
          
    header("Location: templates/frontend/error.php?msg=$msg&page=$page");
        }
      
        include 
    "templates/frontend/rightspace.tpl";
        include 
    "templates/frontend/rightside.tpl";
        include 
    "templates/frontend/footerspace.tpl";
        include 
    "templates/frontend/footerdiv.tpl";
        include 
    "templates/frontend/footer.tpl";
      }
    ?>

  18. #18
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    It doesn't matter what you change in your error.php file - the problem is not there, it's in code the previous page.

    OK, so looking at the code you pasted for the other page, we've got this section where you're callling header():
    PHP Code:
    if (isset($_SESSION['logedin'])) {
          include 
    "templates/frontend/addlink1.tpl";
        } else {
          
    $msg $addlinkerror['login'];
          
    $page '../../index.php';
          
    header("Location: templates/frontend/error.php?msg=$msg&page=$page");
        } 
    You're checking if the user is logged in, and if not you're redirecting to the message display page right? But, you already do the same check at the start of your script, so you can just add an else clause at the end:
    PHP Code:
    include "lib/configuration.php";
    include 
    "language/frontend/portuguese.php";

    if (isset(
    $_SESSION['logedin'])) {
        if (
    $_POST) {
            
    // Form processing and database stuff
        
    } else {
            include 
    "templates/frontend/header.tpl";
            include 
    "templates/frontend/loginspace.tpl";
            include 
    "templates/frontend/registerlogin.tpl";
            include 
    "templates/frontend/searchspace.tpl";
            include 
    "templates/frontend/search.tpl";
            include 
    "templates/frontend/hmenuspace.tpl";
            include 
    "templates/frontend/menubar.tpl";
            include 
    "templates/frontend/leftspace.tpl";
            include 
    "templates/frontend/leftside.tpl";
            include 
    "templates/frontend/contentspace.tpl";
            include 
    "templates/frontend/addlink1.tpl"// Moved from previous IF statement

            // IF statement removed

            
    include "templates/frontend/rightspace.tpl";
            include 
    "templates/frontend/rightside.tpl";
            include 
    "templates/frontend/footerspace.tpl";
            include 
    "templates/frontend/footerdiv.tpl";
            include 
    "templates/frontend/footer.tpl";
        }
    } else {
        
    $msg $addlinkerror['login'];
        
    $page '../../index.php';
        
    header("Location: templates/frontend/error.php?msg=$msg&page=$page");

    As long as your configuration.php and portuguese.php files don't output anything, your header() call will work fine.

  19. #19
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The "registerlogin" Template have a couple of echo's and I can't avoid them

    regarding the beginning of the post: Can we call the doRedirect function from the DIV? If so how?

  20. #20
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,405
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by reisve View Post
    The "registerlogin" Template have a couple of echo's
    Look at the code I posted - if $_SESSION['logedin'] is not set, the registerlogin template is never included.. none of the templates are.

    Quote Originally Posted by reisve View Post
    regarding the beginning of the post: Can we call the doRedirect function from the DIV? If so how?
    OK, maybe I've misunderstood how your app works, but from what you said in your previous posts, this is what I understand:

    pageA
    |
    | If $_SESSION['logedin'] IS set, do some stuff, otherwise call the header() function to do a redirect
    |
    \/
    pageB (error.php)
    |
    | Display a message for 3 seconds, and then redirect to pageC (via a meta tag redirect)
    |
    \/
    pageC (login page?)

    pageA is making a call to header() after some data has already been output, throwing an error. So you never actually get to pageB - so it doesn't matter what you do there.. the redirect on pageB isn't the problem, it's the redirect on pageA that is.

  21. #21
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Edited your logic put some details, but it is about it.

    Quote Originally Posted by fretburner View Post
    OK, maybe I've misunderstood how your app works, but from what you said in your previous posts, this is what I understand:

    pageA
    |
    | If $_SESSION['logedin'] IS set, do some stuff, otherwise call the header() function to inform the user he / her is not logged in
    |
    \/
    pageB (error.php)
    |
    | Display the error message for 3 seconds, and then redirect back to index (via a meta tag redirect)
    |
    \/
    pageC (index.php Where he / she have the option to register)
    The problem is I want to get way of the header() and use div...

  22. #22
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well I got it in a way that satisfy me and my requirements. Got back to the original code with a small change:

    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      <meta http-equiv="content-type" content="text/html; charset=windows-1250">
      <meta name="generator" content="PSPad editor, www.pspad.com">
      <title></title>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
      <script type="text/javascript">
       
        $('#msg').ready(function () {
            setTimeout(function () {
            $('#msg').hide();
            window.location.href = goto;
          }, 3000);
        });
    
      </script> 
    
      <style>
        .hide { 
            display:none; 
        } 
        
        .show { 
            display:block; 
        } 
        /* Information-Success */
        .infobox{
          position: absolute;
          top:50%;
          bottom: 0;
          margin-left: 30%;
          margin-right: 30%;
          width: 40%;
          height:50px;
          padding-top: 5px;
          border:solid 1px #008800;
          background:#D5FFC6;
          color:#48A41C; 
          font-family:Arial, Helvetica, sans-serif; 
          font-size:14px; 
          font-weight:normal;
          text-align:center;
      }
      
        /* Error */
        .errorbox{
          position: absolute;
          top:50%;
          bottom: 0;
          margin-left: 30%;
          margin-right: 30%;
          width: 40%;
          height:50px;
          padding-top: 5px;
          border:solid 1px #880000;
          background:#FDE4E1;
          color:#CB4721; 
          font-family:Arial, Helvetica, sans-serif; 
          font-size:14px;
          font-weight:normal;
          text-align:center;
        }
      </style>
    
      </head>
      <body>
        <script>var goto = 'testcat.php'</script> <!-- Define where to redirect the user -->
        <div id="msg" class = "infobox">You have selected The Info Box</div>  
      </body>
    </html>
    I will stick with this. It is not the most elegant probably, but works

    Thank You for all your help


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
  •