通过按钮点击打开模态

时间:2015-11-01 11:29:33

标签: php html codeigniter

我有一个关于链接codeigniter中文件的基本问题。 我想从导航栏中的注册按钮打开我的模态。由于我的导航栏和模态在不同的文件中。我试图通过在导航栏中的按钮的href字段中给出url来链接它们。

这是目录结构: 应用

- 控制器

----忽略原始

- 观点

---- navbar.php

---- modals.php

Media.php代码

<?php

 class media extends CI_Controller
 {
  public function view ($page='home')
  {
    $data['title']=$page;
    $this->load->view('templates/header', $data);
    $this->load->view('media/navbar');
    $this->load->view('media/'.$page, $data);
    $this->load->view('templates/footer', $data);
    }
  }
 ?>

navbar.php代码

     <nav class="navbar navbar-inverse">
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">WebCast</a>
        </div>
        <div class="collapse navbar-collapse" id="myNavbar">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#">Popular</a></li>
            <li><a href="#">My Channel</a></li>
            <li><a href="#">Favourites</a></li>
          </ul>
          <ul class="nav navbar-nav navbar-right"  >
            <li data-toggle="modal" data-target="#myModalsignup" ><a href="media/modals"><span class="glyphicon glyphicon-user" ></span> Sign Up</a></li>
            <li data-toggle="modal" data-target="#myModallogin" ><a href="#"><span class="glyphicon glyphicon-log-in" ></span> Login</a></li>
          </ul>
        </div>
      </div>
    </nav>

modals.php代码

<!-- Login Modal -->
<div id="myModallogin" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">

         <form class="form-inline" role="form">
          <div class="form-group">
            <label for="email">Email address:</label>
            <input type="email" class="form-control" id="email">
          </div>
          <div class="form-group">
            <label for="pwd">Password:</label>
            <input type="password" class="form-control" id="pwd">
          </div>
          <div class="checkbox">
            <label><input type="checkbox"> Remember me</label>
          </div>
          <button type="submit" class="btn btn-default">Submit</button>
         </form>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>


<!-- Signup Modal -->
<div id="myModalsignup" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">


         <form class="form-inline" role="form">
          <div class="form-group">
            <label for="email">Email address:</label>
            <input type="email" class="form-control" id="email">
          </div>
          <div class="form-group">
            <label for="pwd">Password:</label>
            <input type="password" class="form-control" id="pwd">
          </div>
          <div class="form-group">
            <label for="pwd">Confirm Password:</label>
            <input type="password" class="form-control" id="pwd">
          </div>

          <div class="checkbox">
            <label><input type="checkbox"> Remember me</label>
          </div>
          <button type="submit" class="btn btn-default">Submit</button>
         </form>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

我应该如何在这里提供网址,以便在点击注册时,我应该可以打开我的注册模式?

我没有创建新问题,而是在收到评论后才编辑这个问题?

navbar.php如何知道这些模态ID存在。什么应该是使用的javascript函数,以便点击注册我可以在同一页面上打开模态?

0 个答案:

没有答案