Codeigniter + Bootstrap:在多个文件中拆分选项卡内容

时间:2015-02-26 21:26:48

标签: php angularjs twitter-bootstrap codeigniter

首先,我是网络开发的新手,所以...
我不知道是否有办法执行以下操作(如果这是最佳做法,则无论如何)。

我有一个CodeIgniter + Angularjs应用程序,其中有一个视图包含一个Bootstrap选项卡(也是一个有角度的应用程序):

[view_general_params.php]

<!DOCTYPE html>
<html lang="it">
  <head>
  </head>
  <body ng-controller="HouseController">
    <div class="container">

      <ul class="nav nav-tabs" id="myTab">
        <li class="active"><a href="#general" data-toggle="tab">Home</a></li>
        <li><a href="#panel_params"  data-toggle="tab">Profile</a></li>
        <li><a href="#house_params" data-toggle="tab">Messages</a></li>
        <li><a href="#statistics" data-toggle="tab">Settings</a></li>
      </ul>

      <div class="tab-content">

      </div>

    </div>
  </body>
</html>

现在,由于每个标签必须包含很多控件(文本框等等)。我问自己是否有办法将控件以这种方式加载到控制器加载的不同文件中:

 public function details($house_id)
 {
      $user = $this->session->userdata('user');

      if (is_null($user)) {
           $this->session->sess_destroy();
           redirect('login/index');
      }
      else {
           $data = $this->create_data_array($user);
           $data['house'] = $this->houses_model->get_house($house_id);
           $data['title'] = "House details";

           $this->load->view('head_navbar', $data);
           $this->load->view('house_details_view', $data);
           $this->load->view('view_general_params', $data);
           $this->load->view('view_house_params', $data);
           $this->load->view('view_panel_params', $data);
           $this->load->view('view_statistics', $data);
     }
 }

其他视图包含单个标签页的数据:

[view_general_params.php]

<!DOCTYPE html>
<html lang="it">
  <head>
  </head>
  <body>
    <div class="container">
      <div class="tab-content">
        <div class="tab-pane active" id="general">
          general controls...
        </div>
      </div> 
    </div>
  </body>
</html>

1 个答案:

答案 0 :(得分:1)

是的,你可以。在Codeigniter中,您可以将视图用作模板。采取以下步骤:

  1. views目录中创建一个文件夹,将其命名为“模板” application\views\templates\

  2. 以您希望的方式创建每个模板并将其放在模板文件夹中: application\views\templates\head_navbar.php

    application\views\templates\house_details_view.php

    application\views\templates\view_general_params.php

  3. 在控制器中,您希望使用设置为TRUE的第三个参数调用这些模板,然后将其作为数组值传递给它。然后将此数组发送到您的主视图,如下所示:

    public function details($house_id) {
        $user = $this->session->userdata('user');
    
        if (is_null($user)) {
           $this->session->sess_destroy();
           redirect('login/index');
        } else {
           $data = $this->create_data_array($user);
           $data['house'] = $this->houses_model->get_house($house_id);
           $data['title'] = "House details";
    
           $data_to_final_view = array(
              "view1" => $this->load->view('head_navbar', $data, TRUE),
              "view2" => $this->load->view('house_details_view', $data, TRUE),
              "view3" => $this->load->view('view_house_params', $data, TRUE),
              "view4" => $this->load->view('view_panel_params', $data, TRUE),
              "view5" => $this->load->view('view_statistics', $data, TRUE)
           );
    
           $this->load->view('view_general_params', $data_to_final_view);
        }
    }
    
  4. 现在,在view_general_params视图中,您可以将模板的内容放在任意位置:

    <div class="container">
        <ul class="nav nav-tabs" id="myTab">
            <li class="active"><a href="#general" data-toggle="tab">Home</a></li>
            <li><a href="#panel_params"  data-toggle="tab">Profile</a></li>
            <li><a href="#house_params" data-toggle="tab">Messages</a></li>
            <li><a href="#statistics" data-toggle="tab">Settings</a></li>
        </ul>
    
        <div class="tab-content1">
            <?= $view1 ?>
        </div>
        <div class="tab-content2">
            <?= $view2 ?>
        </div>
         ... etc..
    </div>