How to modify the Alert Button link

Asked

Viewed 69 times

-1

I wanted to know how to change the alert button link. For example, when to press OK go to a page. I tried the following code but it didn’t work:

echo  "<script>alert('Clique para ir para a pagina inicial!'); <a href="home.php"></a> </script>";

2 answers

0

  • With the method alert() we only have one option, click OK and go where window.location.href point.

     echo '<script type="text/javascript">'; 
     echo 'alert("Clique para ir para a pagina inicial!");'; 
     echo 'window.location.href = "/questions/";';
     echo '</script>';
    
  • With the method confirm(), we have two options by clicking on OK go where window.location.href point and click on Cancelar close the dialog box and stay on the page.

     echo '<script type="text/javascript">'; 
     echo 'confirm("Clique OK para ir para a pagina inicial!");'; 
     echo 'window.location.href = "/questions/";';
     echo '</script>';
    

Restrict the use of alert dialog boxes in your HTML document or website projects. The mode of windows disrupts a user’s flow of navigation through their pages. Communicate with your users by other means such as modal window.

Pure CSS and HTML modal window

#modal {
        left: 20%;
        margin: 5px 0 0 0;
        opacity: 1;
        position: absolute;
        top: 5px;
        visibility: visible;
        width: 50%;
        box-shadow: 0 3px 7px rgba(0,0,0,.25);
        box-sizing: border-box;
        transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -webkit-transition: all 0.4s ease-in-out;
    }

        #modal:target{
            opacity: 0;
            top: -50%;
            visibility: hidden;
        }

        #modal .header, #modal .footer {
            border-bottom: 1px solid #e7e7e7;
            border-radius: 5px 5px 0 0;
        }

        #modal .footer {
            border: none;
            border-top: 1px solid #e7e7e7;
            border-radius: 0 0 5px 5px;
        }

        #modal h2 {
            margin: 0;
        }

        #modal .a {
            float: right;
        }
        
        #a,#b {
        font-family: Arial, Helvetica, sans-serif;
         padding: 15px;
        
        }

        #modal .copy, #modal .header, #modal .footer {
            padding: 15px;
        }

    .modal-content {
        background: #f7f7f7;
        position: relative;
        z-index: 20;
        border-radius: 5px;
    }

    #modal .copy {
        background: #fff;
    }

    #modal .overlay {
        background-color: #000;
        background: rgba(0,0,0,.5);
        height: 100%;
        left: 0;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 10;
    }
<div id="modal">
    <div class="modal-content">
        <div class="header">
            <h2>Notification</h2>
        </div>
        <div class="copy">
            <h2>Ir para a pagina inicial?</h2>
        </div>
        <div class="cf footer">
           <a id="a" href="/questions/" class="btn">Sim</a>
            <a id="b" href="#modal" class="btn">Não</a>
        </div>
    </div>
    <div class="overlay"></div>
</div>

0

It is not a standard path, or rather, it has error of thought there. When the person clicks on the ok button of Alert, it means only one consent, that they read the message, nothing else. To redirect to another place, simply place a redirect at the bottom line of the echo message. It can be javascript forwarding even with PHP echo.

echo "window.location.href = "http://www.devmedia.com.br"";

Browser other questions tagged

You are not signed in. Login or sign up in order to post.