Display slide with two records at a time - php

I want to display slide with two records at a time. Now I am only getting only one record at a time in slider because I fetch data in while loop. My code is:
<ul class="slides">
<?php
...
while($eventData = mysql_fetch_array($eventSql))
{
?>
<li class="questions-slide-item">
<div class="query clearfix">
<div class="image fl">
<img src='<?php echo $eventData['image']; ?>' style="width:63px; height:61px;">
</div>
</div>
</li>
<?php } ?>
</ul>

You can add a counter and open/close the list item only every second iteration:
<ul class="slides">
<li class="questions-slide-item">
<?php
...
$count = 0;
while($eventData = mysql_fetch_array($eventSql))
{
if($count > 0 && $count % 2 == 0) {
?>
</li>
<li class="questions-slide-item">
<?php
}
?>
<div class="query clearfix">
<div class="image fl">
<img src='<?php echo $eventData['image']; ?>' style="width:63px; height:61px;">
</div>
</div>
<?php
$count++;
}
?>
</li>
</ul>

You can first take all the rows in one array and then use that array as per your needs.
See to following code to understand what I am trying to say.
<?php
...
$eventData= array();
while($row = mysql_fetch_assoc($eventSql))
{
$eventData [] = $row;
}
for($i=0;count($eventData);$i=$i+2)
{
?>
<li class="questions-slide-item">
<div class="query clearfix">
<div class="image fl">
<img src='<?php echo $eventData[$i]['image']; ?>' style="width:63px; height:61px;">
</div>
</div>
</li>
<li class="questions-slide-item">
<div class="query clearfix">
<div class="image fl">
<img src='<?php echo $eventData[$i+1]['image']; ?>' style="width:63px; height:61px;">
</div>
</div>
</li>
<?php } ?>

Related

Group <li> in to <ul> for every 6 in a while loop

I have a 'while' statement on my WordPress website which grabs the latest posts. I want to group every 6 posts in an ordered list. Is it possible to wrap the <li> elements in a <ul> for every 6 items?
I haven't tried anything to do this yet as not sure if possible. My code below is.
<?php elseif(get_row_layout() == 'posts_section'): ?>
<section class="content posts">
<div class="row">
<div class="columns medium-12">
<ul class="medium-block-grid-3 small-block-grid-2" data-equalizer>
<?php
$catquery = new WP_Query('cat='. get_sub_field('category') .'');
?>
<?php
while($catquery->have_posts()) : $catquery->the_post();
?>
<li data-equalizer-watch>
<a href="<?php the_permalink() ?>" rel="bookmark">
<div class="overlay"></div>
<div class="content">
<p><?php the_title(); ?></p>
<div class="text-center"><?php echo get_the_post_thumbnail($page->ID, 'thumbnail'); ?></div>
</div>
</a>
</li>
<?php
endwhile;
wp_reset_postdata();
?>
</ul>
</div>
</div>
</section>
I cant test the following bit of code since you dont provide any other information, but this is how I would solve this:
<?php elseif(get_row_layout() == 'posts_section'): ?>
<section class="content posts">
<div class="row">
<div class="columns medium-12">
<ul class="medium-block-grid-3 small-block-grid-2" data-equalizer>
<?php
$catquery = new WP_Query('cat='. get_sub_field('category') .'');
?>
<?php
$n = 0; //setting a count
while($catquery->have_posts()) : $catquery->the_post();
if ($n % 6 != 0) {
$n += 1 //keep on increasing till its divisble by 6
?>
<li data-equalizer-watch>
<a href="<?php the_permalink() ?>" rel="bookmark">
<div class="overlay"></div>
<div class="content">
<p><?php the_title(); ?></p>
<div class="text-center"><?php echo get_the_post_thumbnail($page->ID, 'thumbnail'); ?></div>
</div>
</a>
</li>
<?php
}
if ($n % 6 = 0) {
?>
//end the ul tag here and start a new one
</ul>
<ul class="medium-block-grid-3 small-block-grid-2" data-equalizer>
<?php
}
endwhile;
wp_reset_postdata();
?>
</ul>
</div>
</div>
</section>

Bootstrap 4 dynamic nav-pills with php codeigniter not working

When I click different product categories,I cannot get the corresponding product items, but only the items of the active category is displayed.
When I click another nav-item the previously displayed items remain unchanged i.e, unable to change the class " show active" in the tab-panes
Code:
<?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' );
?>
I cannot diagnose the problem in this code, Please help me out from this problem
if you replace:
<?php if($flag==0){echo 'active';$flag ++;}?>
by
<?php if($flag==0){echo 'nav'.$flag;$flag ++;}?>
and delete:
<?php if($counter==0){echo 'show active';}?>
After your script add this
<script>
$(document).ready(function(){
$( ".nav0" ).trigger( "click" );
});
</script>
its good ?
Just match the condition inside a foreach loop:
$cat = $gallery_category_data['gallery_category_name'];
foreach ( $gallery_category_data ['gallery_item'] as $gallery_item_data )
{
if($gallery_item_data['category name in table'] == $cat){
}
}

How the divider will show after 5th box/row?

I want to add or show a divider/dotted underline after 5th box/row only once below is my php code, now it shows after every box/row
<div class="categories-holder">
<?php if ($categories) { ?>
<?php foreach ($categories as $category) { ?>
<div class="box-c">
<div class="bottom">
<div class="top">
<ul class="category">
<li><img src="<?php echo $base; ?>image/<?php echo $category['image']; ?>" width="30" height="30" alt=" " class="icon" /><?php echo $category['name']; ?></li>
</ul>
<div class="clr"></div>
</div>
</div>
</div>
<?php if (count($categories) > '5') { ?>
<div class="divider"></div>
<?php } ?>
<?php } ?>
<?php } ?>
</div>
You can add some counter and increment it in each loop and than use modulo like:
$counter = 0;
if ($counter % 5 == 0) {
...Display divider...
}

Displaying four li's per ul's not returning result as required

I want to display <ul> and <li> dynamically like
<ul>
<li></li>
</li></li>
<li></li>
<li></li>
</ul>
<ul>
<li></li>
</li></li>
<li></li>
<li></li>
</ul>
ie, each <ul> with 4 <li>s.
I want to display these dynamically. I tried with the following code:
$i=0;
foreach($query->result() as $inboxresult)
{
if($inboxquery->num_rows()>0)
{
if($i%4==0)
{
echo '<ul class="msgdisplayul item">';
}
$parentid=$inboxresult->id;
echo '<li class="msgdisplayli">
<div class="msgfullarea">
<div class="displyusrimge">
<input type="hidden" id="status'.$inboxresult->id.'">
<a href="">';
echo '<img src="'.base_url().'images/friend_avatar_default.jpg" alt="Default User Avatar" />';
echo '</a>
</div>
</div>
<div class="clear"></div>
</li>';
if($i%4==0 && $i!=0)
{
echo '</ul>';
}
}
$i++;
}
This is returning result as shown below:
<ul class="msgdisplayul item">
<li class="msgdisplayli">
<div class="msgfullarea">
<div class="displyusrimge">
<input type="hidden" id="status10">
<img src="http://localhost:8080/workspace/project/images/friend_avatar_default.jpg" alt=" Default User Avatar">
</div>
</div>
<div class="clear"></div>
</li>
<li class="msgdisplayli">
<div class="msgfullarea">
<div class="displyusrimge">
<input type="hidden" id="status7">
<img src="http://localhost:8080/workspace/project/images/friend_avatar_default.jpg" alt=" Default User Avatar">
</div>
</div>
<div class="clear"></div>
</li>
<ul class="msgdisplayul item"><li class="msgdisplayli">
<div class="msgfullarea">
<div class="displyusrimge">
<input type="hidden" id="status1">
<img src="http://localhost:8080/workspace/project/images/friend_avatar_default.jpg" alt="Default User Avatar">
</div>
</div>
<div class="clear"></div>
</li>
</ul>
</ul>
Can anybody help me to solve this? Thanks in advance.
You're incrementing $i when you shouldn't... When you don't print li elements, you should not increment $i:
$i = 0;
foreach ($query->result() as $inboxresult)
{
if ($inboxquery->num_rows()>0)
{
if ($i % 4 == 0)
{
echo '<ul class="msgdisplayul item">';
}
$parentid = $inboxresult->id;
echo '<li class="msgdisplayli">
<div class="msgfullarea">
<div class="displyusrimge">
<input type="hidden" id="status'.$inboxresult->id.'">
<a href="">';
echo '<img src="'.base_url().'images/friend_avatar_default.jpg" alt="Default User Avatar" />';
echo '</a>
</div>
</div>
<div class="clear"></div>
</li>';
// if you increment $i here, you don't need to worry if $i = 0 to close the ul
$i++;
if ($i % 4 == 0)
{
echo '</ul>';
}
}
}
Oh, and mixing logic with HTML output, very bad idea ;-)

How to divide categories in rows of three columns

I have a foreach loop which retrieves the subcategories of the current category.
<?php $_categories = $this->getCurrentChildCategories(); ?>
<?php foreach ($_categories as $_category): ?>
<div class="item">
<?php echo $this->htmlEscape($_category->getName()) ?>
</div>
<?php endforeach; ?>
I want to divide the results in rows of three columns. The desired format is then:
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
...
---------------EDIT----------------
My code is now as follows. How and where do i close the row div?
<?php $_categories = $this->getCurrentChildCategories(); ?>
<?php foreach ($_categories as $_category): ?>
<?php if ($i % 3 == 0) { ?>
<div class="row">
<?php } ?>
<div class="item">
<h2><?php echo $this->htmlEscape($_category->getName()) ?> »</h2>
</div>
<?php $i++; endforeach; ?>
---------------EDIT 2----------------
Getting closer. This is the result:
<div class="category-list">
<div class="row"></div>
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
</div>
How do I get rid of the empty row?
The code is now as follows:
<div class="category-list">
<?php
$i=0;
echo '<div class="row">';
$_categories = $this->getCurrentChildCategories();
foreach($_categories as $_category):
{
if($i %3 ==0)
{ ?>
</div>
<div class="row">
<div class="item">
<h2><?php echo $this->htmlEscape($_category->getName()) ?> »</h2>
</div>
<? }
else
{ ?>
<div class="item">
<h2><?php echo $this->htmlEscape($_category->getName()) ?> »</h2>
</div>
<? }
$i++;
}
endforeach;
?>
</div>
---------------EDIT 3----------------
Solved by hiding the empty row via CSS.
You have to introduce az iterator (?) variable for example $i = 0
if ($i % 3 == 0) { //modulo
// use for whatever you want
}
In every cycle (maybe at the end of it, it depends on your real solution) you have to increment $i (++$i);
Hope this helps
<?php
$i=0;
echo"<div class="row" >
foreach($category as $cat)
{
if($i %3 ==0)
{
echo"</div><div class='row'> <div class='item'> Content </div>";
}
else
{
echo"<div class='item'> Content </div>";
}
$i++;
}
echo"</div>";
?>

Categories