使用 codeigniter 创建图库时出错

Question

我已经粘贴了我的数据库的两个屏幕截图以及我希望我的网页看起来如何。我正在努力完成这项工作，但不知道如何解决这个问题我已经将所有图像存储在文件夹中，并将图像路径存储在数据库中，现在我想以这种方式获取图像，当我单击所有作品时它应该显示所有图像但是当我单击创意或摄影或网络时像这样开发然后它应该只显示那些与它们类相关的图像存储在数据库中，类型为列。或者，例如，如果我点击说创意，那么它应该显示第 2、第 3、第 5 和第 8，就像 this.i 真的不知道如何做到这一点。我真的需要帮助

            //-----controller------

            public function portfolio()  
            {  
            $this->load->helper('url');
            $this->load->view('header');
                $data['results'] = $this->Contact_model->getAllRecords3();
            $this->load->view('portfolio',$data); 
            $this->load->view('footer');    
            }


            //--------model-----

            function getAllRecords3()
            {
                return  $this->db->get('portfolio1')->result();
            }


            //-------view---------

            <section id="portfolio">
        <div class="container">
          <div class="center">
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit sed do eiusmod tempor incididunt</p>
          </div>

          <ul class="portfolio-filter text-center">
            <li><a class="btn btn-default active" href="#" data-filter="*">All Works</a></li>
            <li><a class="btn btn-default" href="#" data-filter=".bootstrap">Creative</a></li>
            <li><a class="btn btn-default" href="#" data-filter=".html">Photography</a></li>
            <li><a class="btn btn-default" href="#" data-filter=".wordpress">Web Development</a></li>
          </ul>
          <!--/#portfolio-filter-->
        </div>
        <div class="container">
          <div class="">
            <div class="portfolio-items">

            <?php 
                if( !empty($results) ) {

                    foreach($results as $row) {?>
                    <div class="portfolio-item apps joomla col-xs-12 col-sm-4 col-md-3">
                    <div class="recent-work-wrap">
                      <img class="img-responsive" src="<?php echo base_url('uploads/'.$row->filename);?>" alt="">
                      <div class="overlay">
                          <div class="recent-work-inner">
                      <h3><a href="#"><?php echo $row->first_content; ?></a></h3>
                      <p><?php echo $row->second_content; ?></p>
                      <a class="preview" href="<?php echo base_url('uploads/'.$row->filename);?>" rel="prettyPhoto"><i class="fa fa-eye"></i> View</a>
                      </div>
                        </div>  
                    </div> 
                    </div> 
                   <?php 

                   } ?>

                <?php }
            ?>


                </div>
              </div>
            </div>
          </section>




              <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
              <script src="<?php echo base_url(); ?>js/jquery-2.1.1.min.js"></script>
              <!-- Include all compiled plugins (below), or include individual files as needed -->
              <script src="<?php echo base_url(); ?>js/bootstrap.min.js"></script>
              <script src="<?php echo base_url(); ?>js/jquery.prettyPhoto.js"></script>
              <script src="<?php echo base_url(); ?>js/jquery.isotope.min.js"></script>
              <script src="<?php echo base_url(); ?>js/wow.min.js"></script>
              <script src="<?php echo base_url(); ?>js/functions.js"></script>

Answer 1

请尝试以下解决方案。

您错过了动态 classes 添加 div 像 apps 和 joomla

<div class="portfolio-item apps joomla col-xs-12 col-sm-4 col-md-3">

在您现有代码的上方添加了 class

<?php
foreach($results as $row) {
//code for getting dynamic class names from db
$class = explode(",.", $row->type);
$gettypes = implode(" ", $class); 
?>
<div class="portfolio-item <?php echo $gettypes;?> col-xs-12 col-sm-4 col-md-3">

希望这个作品成功！

Answer 2

您已包含 jquery.isotope.min.js 库，您需要遵循以下文档

https://isotope.metafizzy.co/

$grid.isotope({ filter: '.transition' })

也改为如下查看代码

<div class="portfolio-item <?php echo $gettypes;?> col-xs-12 col-sm-4 col-md-3">

使用 codeigniter 创建图库时出错

error in creating gallery using codeigniter

php

codeigniter

codeigniter-3

codeigniter-2