未显示编码器注册选项卡


codeigniter registration tab not displaying

我使用codeigniter与基础作为我的前端,在我的索引视图上,我有一个与登录和注册表单的选项卡,我的登录表单选项卡显示,但当我点击注册选项卡时,它不显示。当我查看页面源时,注册视图已经正确加载到我的主视图中,它只是不显示。

authentication.php(默认加载的视图)

<div class="row">
    <div class="medium-12 columns">
<ul class="tabs" data-tabs id="authentication_tab">
  <li class="tabs-title is-active"><a href="#panel1" aria-selected="true">Login</a></li>
  <li class="tabs-title"><a href="#panel2" >Sign Up</a></li>
</ul>
<div class="tabs-content" data-tabs-content="authentication_tab">
  <div class="tabs-panel is-active" id="panel1">
  <?php $this->load->view('authentication/login');?>
  </div>
  <div class="tabs-panel " id="panel2">
  <?php $this->load->view('authentication/reg');?>
  </div>
</div>
</div>
</div>
<?php $this->load->view('templates/footer');?>

登录表单

<?php $attributes= array('id'=>'login_form','class'=>'form_horizontal');?>

<?php if($this->session->flashdata('errors')):?>
<?php echo $this->session->flashdata('errors');?>
<?php endif;?>

<?php echo form_open('Authentication/login_check',$attributes);?>

 <div class="medium-12 columns">    
<?php 
echo form_label('Email'); 
$data = array(
'class'=>'form-control',
'name'=>'email',
'placeholder'=>'Email'

);
echo form_input($data);
?>
</div>
<div class="medium-12 columns">    
<?php 
echo form_label('Password'); 
$data = array(
'class'=>'form-control',
'name'=>'password',
'placeholder'=>'Password'

);
echo form_input($data);
?>
</div>
<?php
$data = array(
'class'=>'button large-12',
'name'=>'register',
'id'=>'register',
'value'=>'Register'

);?>
<?php echo form_submit($data);?>
</div>   
<?echo form_close();?>

报名表

<?php $attributes= array('id'=>'registration_form','class'=>'form_horizontal');?>

<?php if($this->session->flashdata('errors')):?>
<?php echo $this->session->flashdata('errors');?>
<?php endif;?>

<?php echo form_open('Authentication/registration_check',$attributes);?>

 <div class="medium-6 columns">    
<?php 
echo form_label('First Name'); 
$data = array(
'class'=>'form-control',
'id'=>'fname',
'name'=>'fname',
'placeholder'=>'First Name'

);
echo form_input($data);
?>
</div>
 <div class="medium-6 columns">    
<?php 
echo form_label('Last Name'); 
$data = array(
'class'=>'form-control',
'name'=>'lname',
'placeholder'=>'Last Name'

);
echo form_input($data);
?>
</div>
 <div class="medium-6 columns">    
<?php 
echo form_label('Email'); 
$data = array(
'class'=>'form-control',
'name'=>'email',
'placeholder'=>'Email'

);
echo form_input($data);
?>
</div>
 <div class="medium-6 columns">    
<?php 
echo form_label('Confirm Email'); 
$data = array(
'class'=>'form-control',
'name'=>'cemail',
'placeholder'=>'Confirm Email'

);
echo form_input($data);
?>
</div>
 <div class="medium-6 columns">    
<?php 
echo form_label('Password'); 
$data = array(
'class'=>'form-control',
'name'=>'password',
'placeholder'=>'Password'

);
echo form_input($data);
?>
</div>
 <div class="medium-6 columns">    
<?php 
echo form_label('Confirm Password'); 
$data = array(
'class'=>'form-control',
'name'=>'cpassword',
'placeholder'=>'Confirm Password'

);
echo form_input($data);
?>
</div>
 <div class="medium-4 columns">
<?php echo "<select name='day' id='day'><option value='default'>day</option>";
for($i=1; $i<32; $i++){
    echo "<option value='$i'".($i==$_POST["day"] ? " selected" : null).">$i</option>";
}
echo "</select>";?>
    </div>
<div class="medium-4 columns">
  <?php
echo "<select name='month' id='month'><option value='default'>month</option>";
for($i=1; $i<13; $i++){
    echo "<option value='$i'".($i==$_POST["month"] ? " selected" : null).">$i</option>";
}
echo "</select>";
?>
    </div>
    <div class="medium-4 columns">
<?php
echo "<select name='year'id='year'><option value='default' >year</option>";
for($i=1900; $i<2016; $i++){
    echo "<option value='$i'".($i==$_POST["year"] ? " selected" : null).">$i</option>";
}
echo "</select>";
?>
    </div>

<?php
$data = array(
'class'=>'button large-12',
'name'=>'register',
'id'=>'register',
'value'=>'Register'

);?>
<?php echo form_submit($data);?>
</div>   
<?echo form_close();?>

authentication.css

body{
     background-color:#f2f2f0;
 }
/* registration and login form tab design*/
 .tabs {
    width:400px;
    background-color: #fff;
    border-color: #fff;
    text-align:center;
    border-top-left-radius:2em;
    border-top-right-radius:2em;
}
.tabs,.tabs-content {
    border-color: #ccc;
    -webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
}
.tabs a{
    width:199px;
    text-decoration: none;
    color: #2199e8;
    font-weight: bold;
    font-size: 15px;
    -webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    transition: all 0.1s linear;
    text-align:center;
}
 .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] {
 background: white; 
 color:#147cc0;
 border-top-right-radius:2em;
 border-top-left-radius:2em;
 }
.tabs-title > a:hover {
      border-top-right-radius:2em;
      border-top-left-radius:2em;
      color:#147cc0;
}

.tabs-content {
           width:400px;
           background-color:#fff;
        border-bottom-left-radius:2em;
        border-bottom-right-radius:2em;
}
.row {
position:absolute;
top:30%;
left:40%;
margin-top:-50px; /* this is half the height of your div*/  
margin-left:-100px; /*this is half of width of your div*/
 }
.button {
border-radius:5px;
font-weight: bold;
}
/* End of registration and login form tab design*/

/* registration form style */
label,#day,#month,#year {
    color: #2199e8;
    font-weight:bold;
}
.form-control {
color:#147cc0;
font-weight:bold;
}

/* End of registration form style */
/* callout style  */
.email_success {
border-radius:20px;    
background-color:#7CFF8A;   
color:white;
width:800px;    
position:absolute;
top:30%;
left:30%;
margin-top:-50px; /* this is half the height of your div*/  
margin-left:-100px; /*this is half of width of your div*/
-webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
}
/* End of callout style */

谢谢你的帮助,我找到了问题所在。

在我的登录视图的底部,我错过了php标签的php,如下所示

<?echo form_close();?>

改为

<?php echo form_close();?>

已编辑如未添加请添加以下内容

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.2.3/foundation-flex.css">
    <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
    <script type="text/javascript" src="http://foundation.zurb.com/sites/docs/v/5.5.3/assets/js/modernizr.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.2.3/plugins/foundation.core.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.2.3/foundation.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.2.3/plugins/foundation.tabs.js"></script>

正确阅读文档后,我发现我们需要像这里提到的那样初始化它http://foundation.zurb.com/sites/docs/javascript.html#initializing

所以只需再添加一个东西,即

<script type="text/javascript">
    $(document).foundation();
</script>

,您的代码将开始工作。