Question

我创建的Navbar有两个输入字段，一个提交按钮，一个下拉列表和另外两个按钮。当我运行代码时，它看起来就像我想要它的样子。请参见下面的第一张图片。但是在使用它时会出现几个问题。第一个发生是因为同一页面上方有一个Bootstrap下拉列表。选择现有网络＆＃39;你在下面的图片中看到。当选择该下拉菜单中的任何项目时，它会替换“显示/隐藏”按钮。您在第二张图片中看到的导航栏中的下拉按钮（紫色）。如果您从＆＃39;显示/隐藏＆＃39;中选择某些内容，则会替换“选择现有网络”＆＃39;标题，使两者都无用。

我之前已经问过这个问题，但没有很好地解释或显示图像。我还在“现有网络”下方添加了导航条代码。下拉是在从MySQL数据库调用的PHP代码中创建的。该代码也包括在内。

<?php              
echo ('<button id="dpbutton" class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> Select an Existing Net  -- (Green means its an open net)
    <span class="caret"></span>
</button>

<ul id="allnets" class="dropdown-menu" role="menu" aria-labelledby="ALLNETS">
<li role="presentation">
    <a href = "#" onclick = "showActivities(\"0\")">Show All Stations in DB</a></li>
<li class="divider"></li>');

        foreach($db_found->query("SELECT netid, activity, logdate, frequency, netcall, timeout,
            GROUP_CONCAT(DISTINCT netid) 
            FROM NetLog 
            WHERE netid <> '0' and logdate >= (NOW() - INTERVAL 90 DAY)
              $andLine
            GROUP BY netid 
            ORDER BY netid  DESC
            ") as $act){

            if ("$act[timeout]" == "") {    
                $netCall = "$act[netcall], Net #: $act[netid] --> $act[activity] of $act[logdate]"; 
                echo ("<li role='presentation' class=' bg-success ' data-value=\"$act[netid]\">
                    <a href='#' role='menuitem' onclick = 'showActivities($act[netid])'>
                        $netCall
                    </a></li>
                    <li class=\"divider\"></li>");
            } else {
                $netCall = "$act[netcall], Net #: $act[netid] --> $act[activity] of $act[logdate]";
                echo ("<li role='presentation' data-value=\"$act[netid]\">
                    <a href='#' role='menuitem' onclick = 'showActivities($act[netid])'>
                        $netCall
                    </a></li>
                    <li class=\"divider\"></li>");
            }
        } // end of the query, after the as $act         
    ?>
</ul>

图片1。

图片2。

<nav id="admin" class="  navbar navbar-inverse admin flashit roundit" role="navigation">
<!--    <div class=" container-fluid"> -->
        <div class="navbar-header">
            <a class="navbar-brand" href="#"></a>
        </div>
        <form class="navbar-form navbar-left">
          <div class="form-group">

            <input id="cs1" type="text" class="form-control" placeholder="Call Sign"  tabindex=1 onkeyup="showHint(this.value);"  maxlength="16" onmousedown="isKeyPressed(event)" autofocus />

            <input id="Fname" type="text" class="form-control" placeholder="First Name" tabindex=2 onkeyup="nameHint(this.value);" onblur="checkIn();" />

          </div>
        </form>

        <button id="ckin2" type="submit" class="btn btn-success" tabindex=3  >Check In</button>


        <div class="btn-group">
            <span class="dropdown">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Show/Hide
                    <span class="caret"></span>
                </button>  
                    <ul class="dropdown-menu" aria-labelledby="SHOWSTUFF">

                    <li><a href="#">Grid</a></li>
                    <li><a href="#">eMail</a></li>
                    <li><a href="#">Lat/Lon</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a href="#">Last Name</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a href="#">TOD</a></li>
                </ul>

            </span>
        </div>


        <button id="time" class=" btn btn-info navbar-btn " type="button" onClick="TimeLine();" >Time Line</button>

        <button id="closelog" class=" btn btn-danger navbar-btn closenet "  type="button" value="Close Net" oncontextmenu="rightclickundotimeout();return false;">Close Net</button>    


<!--    </div> --> <!-- end container fluid -->
</nav>

如何创建并使以下Bootstrap Navbar工作？

0 个答案: