如何添加功能的引导搜索栏

我必须建立在我的网站上的导航栏，我已经设置了对导航栏右侧的搜索栏，请参见下面如何添加功能的引导搜索栏

<nav class="navbar navbar-trans navbar-fixed-top" role="navigation"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapsible"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand text-danger" href="index.php">Network TV</a> 
     </div> 
     <div class="navbar-collapse collapse" id="navbar-collapsible"> 
      <ul class="nav navbar-nav navbar-left"> 
       <li><a href="#section1">Home</a></li> 
       <li><a href="#section2">Top rated</a></li> 
       <li><a href="#section3">Most Popular by Genre</a></li> 
       <li><a href="#section4">Music</a></li> 
       <li><a href="#section5">Suggestions</a></li> 
       <li id="adminpanel"><a href="admin/data_display.php">Admin control panel</a></li> 
       <li>&nbsp;</li> 
         <div class="col-sm-3 col-md-3 pull-right"> 
     <form class="navbar-form" role="search"> 
     <div class="input-group"> 
      <input type="text" class="form-control" placeholder="Search" name="srch-term" id="srch-term"> 
      <div class="input-group-btn"> 
       <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button> 
      </div> 
     </div> 
     </form> 
     </div> 
      </ul> 
     </div> 
    </div> 
    </div> 
</nav>

代码我想知道我如何做到这一点，当用户输入信息到搜索栏时，结果将显示在引导模式中。例如他们键入'电影'一个电影模式将弹出与它的电影名称。这里是搜索栏的特写

<div class="col-sm-3 col-md-3 pull-right"> 
     <form class="navbar-form" role="search"> 
     <div class="input-group"> 
      <input type="text" class="form-control" placeholder="Search" name="srch-term" id="srch-term"> 
      <div class="input-group-btn"> 
       <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button> 
      </div> 
     </div> 
     </form> 
     </div>

来源

2015-07-12 Oliver Ketley

这将需要JavaScript ... –

我有点想通了，谢谢，你知道我会需要什么样的JavaScript？ –

不...你必须做一些研究，收集输入数据，将它与数据库进行比较，并使用ajax输出结果。 –

这取决于你如何计划抓取数据。如果我确实是对的，那么您只需要向电影的某个数据库发出POST/GET请求。看起来像PHP，也许Wordpress/Drupal，所以猜测它会是一个MySQL请求。

这是来自PHP Academy的免费教程，Alex是一位很好的导师。

PHPAcademy视频： https://www.youtube.com/watch?v=Yb3c-HljFro

干杯。

来源

2015-07-12 13:58:12 leocreatini

哇，这是一个巨大的帮助，谢谢。我如何将视频存储在数据库中？这可能吗？ –

视频往往存储在文件系统/云（Amazon S3）中，或者存储在YouTube/Vimeo等网站中，因为它们是大量文件。您可以将它作为BLOB（二进制对象）存储在数据库中。这将是更多的学习，对于大型文件（> 50-100mb）仍然不是很好。 – leocreatini

好的，这个网站只是我的家庭网络的本地网站，所以这些文件将托管在本地服务器上。所以我只需要引用服务器上文件系统的文件，如/movies/'moviesname.mp4' –

如何添加功能的引导搜索栏

回答

相关问题