如果用户登录,请在引导程序中更改导航栏

时间:2014-11-30 02:09:38

标签: javascript php html twitter-bootstrap-3 navbar

我有一个标准菜单,包括"记录" in和"创建用户"。我想要的是,当你创建一个用户或你记录整个导航栏菜单来改变时,比如说,"我的用户的页面"和"退出"相反,我该怎么办呢?

<div id="menu">
    <nav class="navbar">
        <div class="container">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#"><span class="glyphicon glyphicon-home">  </span>    Home</a></li>
                <li><a href="#">Descuentos</a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Categories<span class="caret"/></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Cat A</a></li>
                        <li><a href="#" >Cat B</a></li>
                        <li><a href="#">Cat C</a></li>
                    </ul>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="createaccount.php"><span class="glyphicon glyphicon-user"></span>Create account</a></li>
                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="#"><span class="glyphicon glyphicon-log-in"></span>  Login</a>
                    <ul class="dropdown-menu" role="menu">
                        <li>
                            <form class="form-horizontal" role="form" action="tienda.php"  method="POST">
                                <div class="form-group">
                                    <label class="control-label col-md-4" for="nombre">User:</label>
                                    <div class="col-md-8">
                                        <input type="text" class="form-control" name="loginUser" required>
                                    </div>
                                    <label class="control-label col-md-4" for="nombre">Pass:</label>
                                    <div class="col-md-8">
                                        <input type="password" class="form-control" name="loginPass" required> <br>
                                    </div>
                                    <div class="col-md-5"></div>
                                    <button type="submit" class="btn btn-default col-md-5">Log In</button>
                                </div>
                            </form>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </nav>
</div>

基本上,改变

<ul class="nav navbar-nav navbar-right">
                    <li><a href="createaccount.php"><span class="glyphicon glyphicon-user"></span>Create account</a></li>
                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="#"><span class="glyphicon glyphicon-log-in"></span>  Login</a>
                        <ul class="dropdown-menu" role="menu">
                            <li>
                                <form class="form-horizontal" role="form" action="tienda.php"  method="POST">
                                    <div class="form-group">
                                        <label class="control-label col-md-4" for="nombre">User:</label>
                                        <div class="col-md-8">
                                            <input type="text" class="form-control" name="loginUser" required>
                                        </div>
                                        <label class="control-label col-md-4" for="nombre">Pass:</label>
                                        <div class="col-md-8">
                                            <input type="password" class="form-control" name="loginPass" required> <br>
                                        </div>
                                        <div class="col-md-5"></div>
                                        <button type="submit" class="btn btn-default col-md-5">Log In</button>
                                    </div>
                                </form>
                            </li>
                        </ul>
                    </li>
                </ul>

到此:

<ul class="nav navbar-nav navbar-right">
                    <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="#"><span class="glyphicon glyphicon-user"></span>Nombre USUARIO</a>

                    <ul class="dropdown-menu" role="menu">
                            <li><a href="#">Mi página</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-shopping-cart"></span>  Carrito</a></li>
                        </ul>
                    </li>


                    <li><a href="#"><span class="glyphicon glyphicon-log-out"></span>  Logout</a></li>

                </ul>

最好的方法是什么?

3 个答案:

答案 0 :(得分:3)

这就是我通常这样做的方式:

<?php
if($logged_id){
    include 'menu_authenticated.php';
}
else{
    include 'menu_unauthenticated.php';
}
?>

<?php if($logged_id){ include 'menu_authenticated.php'; } else{ include 'menu_unauthenticated.php'; } ?>

当然,这些文件将分别有他们的菜单 //menu_unauthenticated.php

<ul class="nav navbar-nav navbar-right">
                    <li><a href="createaccount.php"><span class="glyphicon glyphicon-user"></span>Create account</a></li>
                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="#"><span class="glyphicon glyphicon-log-in"></span>  Login</a>
                        <ul class="dropdown-menu" role="menu">
                            <li>
                                <form class="form-horizontal" role="form" action="tienda.php"  method="POST">
                                    <div class="form-group">
                                        <label class="control-label col-md-4" for="nombre">User:</label>
                                        <div class="col-md-8">
                                            <input type="text" class="form-control" name="loginUser" required>
                                        </div>
                                        <label class="control-label col-md-4" for="nombre">Pass:</label>
                                        <div class="col-md-8">
                                            <input type="password" class="form-control" name="loginPass" required> <br>
                                        </div>
                                        <div class="col-md-5"></div>
                                        <button type="submit" class="btn btn-default col-md-5">Log In</button>
                                    </div>
                                </form>
                            </li>
                        </ul>
                    </li>
    </ul>

// menu_authenticated.php <ul class="nav navbar-nav navbar-right"> <li><a href="createaccount.php"><span class="glyphicon glyphicon-user"></span>Create account</a></li> <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a> <ul class="dropdown-menu" role="menu"> <li> <form class="form-horizontal" role="form" action="tienda.php" method="POST"> <div class="form-group"> <label class="control-label col-md-4" for="nombre">User:</label> <div class="col-md-8"> <input type="text" class="form-control" name="loginUser" required> </div> <label class="control-label col-md-4" for="nombre">Pass:</label> <div class="col-md-8"> <input type="password" class="form-control" name="loginPass" required> <br> </div> <div class="col-md-5"></div> <button type="submit" class="btn btn-default col-md-5">Log In</button> </div> </form> </li> </ul> </li> </ul>

答案 1 :(得分:0)

不是说这是'做'的方式。但它是一个选项:)该选项包括创建一些PHP函数。一个输出'退出'的meny,另一个输出'登录'meny。

然后简单地没有你将拥有这个代码的meny:

<?php
if($loggedIn)
  renderLoggedInMeny();
else
  renderLoggedOutMeny();
?>

这些功能可能如下所示:

function renderLoggedInMeny() {
  echo <<<EOT
<ul class="nav navbar-nav navbar-right">
  <li... [and so on]
EOT;
}

答案 2 :(得分:0)

对于下面的代码,我假装你有一个isLogged()函数,如果用户登录则返回true,否则返回false。这是您可以在导航栏代码中执行的操作:

<?php if(isLogged()): ?>
<li><a href="profile.php">Profile</a></li>
<li><a href="logout.php">Logout</a></li>
<?php else: ?>
<li><a href="login.php">Login</a></li>
<li><a href="register.php">Register</a></li>
<?php endif; ?>

当然,PHP条件之间的代码可以更改,您可以直接放置ul元素,而不是像我一样只放置li - 这只是为了演示的目的。