SitePoint Sponsor

User Tag List

Page 2 of 2 FirstFirst 12
Results 26 to 39 of 39
  1. #26
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    When there is an error, or an operation success, display the message for, lets say 3000 ms, and redirect the user to another page, without the user intervention. Needs to be possible to change layout (with CSS?).

  2. #27
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    When there is an error, or an operation was concluded with success and the user needs to be modified, a message is displayed for a certain amount of time, and the user gets redirected to another page. The message is on a language file.

  3. #28
    SitePoint Mentor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,255
    Mentioned
    32 Post(s)
    Tagged
    4 Thread(s)
    So, one way to do this using the plugin you suggested (Zebra_Dialog) would be like this:

    1. Include the following files in your page
    HTML Code:
    <script type="text/javascript" src="path/to/zebra_dialog.js"></script>
    <link rel="stylesheet" href="path/to/zebra_dialog.css" type="text/css">
    2. Use an IF statement in your PHP to include the following JS on the page (just before the </body> tag) when needed:
    PHP Code:
    <?php if ($checkToDisplayAlert): ?>
    <script>
    new $.Zebra_Dialog('<?php echo $yourMsgToUser ?>', {
        'buttons':  false,
        'modal': false,
        'type': 'error', // You could set this via PHP too
        'auto_close': 3000,
        'onClose':  function() {
            window.location.href = '<?php echo $redirectUrl ?>';
        }
    });
    </script>
    <?php endif; ?>
    I've not had chance to test this on my machine, but it's all taken from the plugin documentation, so should work as expected.

  4. #29
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I tried it from the documentation and couldn't make it to work. I will give it a try. It can't be inserted before the body tag. It needs to be called where the error occurred or where the info needs to be passed to the user. A single page can have from one to 'n' depending of what is going on on the page. Accessing the database for example, yeou can have an error connecting to the server/database, an error on the query, another retrieving the rows, and so on

  5. #30
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    As I said. Tested it (without the if ... endif loop) and does not work. Here is the page:

    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 type="text/javascript" src="js/zebra_dialog.js"></script>
        <link rel="stylesheet" href="css/zebra_dialog.css" type="text/css">  
    </head>
      <body>
    <script> 
    new $.Zebra_Dialog('<?php echo $yourMsgToUser ?>', { 
        'buttons':  false, 
        'modal': false, 
        'type': 'error', // You could set this via PHP too 
        'auto_close': 3000, 
        'onClose':  function() { 
            window.location.href = '<?php echo $redirectUrl ?>'; 
        } 
    }); 
    </script> 
      </body>
    </html>

  6. #31
    SitePoint Mentor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,255
    Mentioned
    32 Post(s)
    Tagged
    4 Thread(s)
    You need to include jQuery, as the plugin won't work without it.

  7. #32
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I included everything as you email. I'm sorry but I don't know nothing about jQuery
    The new code:

    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="//code.jquery.com/jquery-1.9.1.js"></script>
        <script type="text/javascript" src="js/zebra_dialog.js"></script>
        <link rel="stylesheet" href="css/zebra_dialog.css" type="text/css">  </head>
      <body>
    <script> 
    new $.Zebra_Dialog('<?php echo $yourMsgToUser ?>', { 
        'buttons':  false, 
        'modal': false, 
        'type': 'error', // You could set this via PHP too 
        'auto_close': 3000, 
        'onClose':  function() { 
            window.location.href = '<?php echo $redirectUrl ?>'; 
        } 
    }); 
    </script> 
      </body>
    </html>
    is this correct now?

  8. #33
    SitePoint Mentor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,255
    Mentioned
    32 Post(s)
    Tagged
    4 Thread(s)
    Here's the code for the whole page, based on what you posted. This works fine for me on my machine:
    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.aspnetcdn.com/ajax/jquery/jquery-1.10.1.min.js"></script>
      <script type="text/javascript" src="js/zebra_dialog.js"></script>
      <link rel="stylesheet" href="css/zebra_dialog.css" type="text/css">
    </head>
      <body>
        <script> 
        new $.Zebra_Dialog('<?php echo $yourMsgToUser ?>', { 
            'buttons':  false, 
            'modal': false, 
            'type': 'error', // You could set this via PHP too 
            'auto_close': 3000, 
            'onClose':  function() { 
                window.location.href = '<?php echo $redirectUrl ?>'; 
            } 
        }); 
        </script> 
      </body>
    </html>

  9. #34
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is what I need. Now, do you see any way of reduce this to a two line code (leave most of the code in the header, and just include two lines where the message is to be included: One for the message itself and another one for the redirection). Also how would all the parameters be changed externaly (by PHP?). I would have one script for the error and another one for the info messages.

  10. #35
    SitePoint Mentor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,255
    Mentioned
    32 Post(s)
    Tagged
    4 Thread(s)
    You could do something like this:

    notification.js
    Code JavaScript:
    function showNotification(message, type, url){
        return new $.Zebra_Dialog(message, { 
            'buttons':  false, 
            'modal': false, 
            'type': type,
            'auto_close': 3000, 
            'onClose':  function() { 
                window.location.href = url; 
            } 
        });
    };

    then just include the file on your page:
    HTML Code:
    <script type="text/javascript" src="js/notification.js"></script>
    and to call it (for both errors and info messages) would be like this:
    PHP Code:
    // For errors
    echo "<script>showNotification($errorMsg, 'error', $url);</script>";
    // For info
    echo "<script>showNotification($infoMsg, 'information', $url);</script>"

  11. #36
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Man... You are a Genius. Exactly what I was looking for. It is perfect!!!

  12. #37
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry for getting back to the post. Just one question> The box appears out of nowhere, and disappears going up. Do you have any idea how to make it fade in, fadeout?

    I changed a lot on the CSS, just to keep the essential for me, and did not see anything to change this.

    Sorry to bother you again, but you are my jQuery/javaSript Guru


  13. #38
    SitePoint Mentor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,255
    Mentioned
    32 Post(s)
    Tagged
    4 Thread(s)
    To have the message fade in is easy enough:
    Code JavaScript:
    return new $.Zebra_Dialog(message, { 
        'buttons':  false, 
        'modal': false, 
        'type': type,
        'auto_close': 3000,
        'animation_speed_show': 500,  // Add this line here
        'onClose':  function() { 
            window.location.href = url; 
        } 
    });
    Unfortunately, making the box fade out at the end instead of sliding up isn't that easy, and you'd have to modify the plugin itself

  14. #39
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Lisbon
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That it is great. I would modify the plugin myself if I knew anything about java Script and the plugin were in a readable form.

    But Thank You anyway.


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
  •