CodeIgniter Forums

Full Version: Bootstrap carousel & Codeigniter
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hi Everyone,

Sorry if this is a basic question but for some unknown reason I am stuck,

I would like to show a carousel of info on a site using codeigniter and MySQL with an active class on the first row and then a non active on the others, Below is my Model and View:

PHP Code:
function get_where($id) {
$table $this->get_table();
$this->db->select('*');
$this->db->from($table);
$this->db->join('cmsarticles_cat''cmsarticles.cmsarticles_cat_id = cmsarticles_cat.cmsarticles_cat_id');
$this->db->where('cmsarticles.cmsarticles_cat_id'$id);
$query $this->db->get();
return 
$query;


PHP Code:
<section class="block news" id="news">
 
       <div class="heading"><h2>News and promotions</h2><span class="triangle"></span></div>
 
       
        
<div class="container animation" data-animation="fadeInUp">
 
           <div id="news-carousel" class="carousel slide" data-ride="carousel">
 
               <div class="carousel-inner">
 
                   <!-- Active Item -->
 
                   <?php
                    $i 
1;
 
                   foreach ($news->result() as $news): 
 
                   $item_class = ($i == 1) ? 'item active' 'item'                   
                    ?>
                    
                    <div class="<?php echo $item_class ?>">
                        <div class="container">
                            <div class="col-lg-5 col-md-5 col-lg-offset-1 col-md-offset-1"> 
                              <h3><?php echo $news->cmsarticles_title ?></h3>
                              <h4><?php echo $news->cmsarticles_date ?></h4>
                              <p><?php echo $news->cmsarticles_content ?></p>
                            </div>
                            <div class="col-lg-6 col-md-6">
                                <img src="assets/img/news/1.png" width="322" height="282" alt="News1"/>
                            </div>
                    <?php  
                    $i
++;
 
                   endforeach;
 
                   ?>
                        </div>
                    </div> 
                </div>
            </div>
        </div>
</section> 

It is probably really simple but i just can't get my head around it, if someone could help that would be much appreciated.

Thanks
Hard to know for sure without seeing your controller where you are using the model and passing the data to the view. What exactly isn't working?
My best guess would be two things:
- use $i === 1 instead of $i == 1.
- in your foreach(), choose a different name for the variable after 'as', then change all of the references to $news inside the loop. At best, foreach($news->result() as $news) is confusing; at worst, it may be causing errors.

If you're not using the value of $i for any other purpose, though, I would suggest setting $item_class = 'item active' before the loop and setting it to 'item' just before closing the loop, removing the variable $i and the conditional completely.

You should also check your HTML against the Bootstrap documentation, and make sure that within the foreach() loop you close every tag you open. Here's an untested attempt at fixing everything obvious:


PHP Code:
<section class="block news" id="news">
 
   <div class="heading"><h2>News and promotions</h2><span class="triangle"></span></div>
 
   <div class="container animation" data-animation="fadeInUp">
 
       <div id="news-carousel" class="carousel slide" data-ride="carousel">
 
           <div class="carousel-inner">
 
               <?php
                $item_class 
' active';
 
               foreach ($news->result() as $newsResult): 
 
               ?>
                <div class="item<?php echo $item_class?>">
                    <img src="assets/img/news/1.png" width="322" height="282" alt="News1"/>
                    <div class="carousel-caption"> 
                        <h3><?php echo $newsResult->cmsarticles_title ?></h3>
                        <h4><?php echo $newsResult->cmsarticles_date ?></h4>
                        <p><?php echo $newsResult->cmsarticles_content ?></p>
                    </div>
                </div>
                <?php  
                    $item_class 
'';
 
               endforeach;
 
               ?>
            </div>
        </div>
    </div>
</section> 
Hi,

Thanks very much, it is working now. Half the issue was two of the div's were being closed after the foreach. But all good.

Thanks