带有PHP Codeigniter的Bootstrap 4动态导航丸不起作用

时间:2018-09-20 11:42:41

标签: php html codeigniter bootstrap-4 nav-pills

当我单击不同的产品类别时,我无法获得相应的产品项目,而仅显示活动类别的项目。 当我单击另一个导航项时,以前显示的项保持不变,即无法更改选项卡窗格中的“显示活动”类

代码:

<?php
$this->load->view ( 'templates/header' );
?>
<section class="container">
   <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
      <?php $flag = 0; foreach ( $gallery_category as $gallery_category_data ) {?>
      <li class="nav-item">
         <a class="nav-link <?php if($flag==0){echo 'active';$flag ++;}?>" 
            id="pills<?php echo $gallery_category_data['gallery_category_id'];?>" 
            data-toggle="pill" href="#<?php echo $gallery_category_data['gallery_category_id'];?>" 
            role="tab" aria-controls="pill<?php echo $gallery_category_data['gallery_category_id'];?>" 
            aria-selected="<?php if($flag==0){echo 'true';}?>"><?php echo $gallery_category_data['gallery_category_name'];?></a>
      </li>
      <?php     }?>
   </ul>
   <div class="tab-content" id="pills-tabContent">
      <?php $counter=0; foreach ( $gallery_category as $gallery_category_data ) {?>
      <div class="tab-pane fade <?php if($counter==0){echo 'show active';}?>" id="<?php echo $gallery_category_data['gallery_category_id'];?>" role="tabpanel" aria-labelledby="pills<?php echo $gallery_category_data['gallery_category_id'];?>">
         <h6><?php echo $gallery_category_data['gallery_category_name']; ?></h6>
         <div class="row">
            <?php foreach ( $gallery_category_data ['gallery_item'] as $gallery_item_data ) {?>
            <div class="col-md-3 mb-3">
               <figure>
                  <img src="<?php echo base_url();?>assets/img/products/<?php echo $gallery_item_data['gallery_image']; ?>" class="img-fluid">
                  <a href="product_details.php">
                     <figcaption class="text-center">
                        <h6 class="mt-3">Saree</h6>
                        <p class="text-muted"><strong>Rs. 799 /-</strong></p>
                     </figcaption>
                  </a>
               </figure>
            </div>
            <?php }?>
         </div>
      </div>
      <?php $counter++; }?>
   </div>
</section>
<?php
$this->load->view ( 'templates/footer' );
?>

我无法通过此代码诊断问题,请帮助我解决该问题

2 个答案:

答案 0 :(得分:0)

如果您替换:

<?php if($flag==0){echo 'active';$flag ++;}?>

通过

<?php if($flag==0){echo 'nav'.$flag;$flag ++;}?>

并删除:

<?php if($counter==0){echo 'show active';}?>

在脚本之后添加此

<script>
$(document).ready(function(){
  $( ".nav0" ).trigger( "click" );
});
</script>

它好吗?

答案 1 :(得分:0)

只需匹配 foreach 循环内的条件:

public delegate void statusChange();

public partial class Settings_form : Form
{
    public event statusChange changeTheme;

    //Here is some function, variables declaration and code

    private void UseDarkMode_chk_CheckedChanged(object sender, EventArgs e)
    {
        //Some code
        SettingsClass.UseDarkMode = this.UseDarkMode_chk.Checked;
        //if (changeTheme != null)
            changeTheme();
    }
}



public partial class Main_form : Form
{

    private void Form1_Load(object sender, EventArgs e)
    {

        callChangeTheme();
    }

    private void settingsToolStripMenuItem_Click(object sender, EventArgs e)
    {
        Settings_form settings_Form = new Settings_form();
        settings_Form.Show();
    }


    public void callChangeTheme()
    {
        Settings_form settings_Form = new Settings_form();
        settings_Form.changeTheme += new statusChange(chooseOtherTheme);
    }

    public void chooseOtherTheme()
    {
        if (SettingsClass.UseDarkMode)
            ToDarkMode();
        else ToLightMode();
    }

    public void ToDarkMode()
    {
        this.BackColor = Color.FromArgb(((int)(((byte)(28)))), ((int)(((byte)(28)))), ((int)(((byte)(28)))));
    }

    public void ToLightMode()
    {
         this.BackColor = Color.FromArgb(((int)(((byte)(241)))), ((int)(((byte)(241)))), ((int)(((byte)(241)))));
    }
}