Hide Form Div Using PHP if Statment

Question

Trying to make a login form become hidden once a successful login has happened within the form, so that the form cannot be seen by the user once they are logged in, but I still need a success message to be displayed when a successful login has happened. I have the form and the login sorted and it displayed a success message when a successful login has been made but I cant hide the form upon successful login. i have an if statement set up using isset but that's as far as I got I don't know what needs to go inside the if statement for me to hide the form.

This is the PHP code for my login page -

        <?php
    require('includes/application_top.php');
    $page_title='Login!';
    if (isset($_POST['action'])) {
        $username_input = $_POST['username'];
        $password_input = $_POST['password'];
        $login_ok = login($username_input, $password_input);
    }
    require('includes/site_header.php');
    ?>
    <style>
    <?php
    require('css/login.css');
    ?>
    </style>
    <br>
    <br>
    <br>
    <?php
            if (isset($login_ok)) {
                ?>
                <div class="row">
                    <div class="col-sm-12">
                        <?php
                        if ( ! $login_ok) {
                            ?>
                            <div class="alert alert-danger">
                                <p>Your credentials were invalid</p>
                            </div>
                            <?php
                        } else {
                            ?>
                            <div class="alert alert-success">
                                <p>Login successful</p>
                            </div>
                            <?php
                        }
                        ?>
                    </div>
                </div>
                <?php
            }
            ?>
    <!-- This is the if statement I mention -->
    <?php 
         if !isset($login_okay){
            ?>
            <div class="wrapper dafswInDown" hidden>
          }
    ?>


    <div class="wrapper fadeInDown">
      <div id="formContent">
        <!-- Icon -->
        <div class="fadeIn first">
          <br>
          <img src="images/Head1.jpg" style="height: 40%; width: 60%;" id="icon" alt="User Icon" />
          <br>
          <h3> Login! </h3>
        </div>
        <br>
        <!-- Login Form -->
        <form id="login_form" action="login_page.php" method="post">
          <input type="text" class="fadeIn second" id="username" name="username" placeholder="Username" value="<?= isset($_POST['username']) ? htmlspecialchars($_POST['username']) : '' ?>" maxlength="100" />
          <input type="password" class="form-control" id="password" name="password" placeholder="Password" value="" />
          <input type="submit" class="fadeIn fourth" name="action" value="Login"/>
        </form>

        <!-- Remind Passowrd -->
        <div id="formFooter">
          <a class="underlineHover" href="#">Forgot Password?</a>
        </div>


      </div>
    </div>


    <?php
    require('includes/application_bottom.php');
    require('includes/site_footer.php');
    ?>

Answer 1

There are a number of different ways you can approach this problem, but i think the best way to do this is with a session variable. Make your login function create a session variable that will follow the logged in user around throughout the website, then its just a matter of checking for the value and either displaying or hiding the form based on that. Here is a simplified example:

<?php function login($username_input=false, $password_input=false){
  // Do all your verification here
  // If logged in then:
  session_start();
  $_SESSION["user"] = true;
}

// Then on the form side just do this:
if(!$_SESSION["user"]){ ?> 
  FORM HERE
<?php } ?>