I have a 5 point rating system I am trying to change up how it displays the rating.
So before it would be 5 dots all white if not rated, then color in the ratings blue.. I would display these dots via fontawesome glyphs. So it would output 5 of them.
But now i'm trying to change it where the 5 point rating would display a progress bar and the 5 points be used as percentages for the length of progress.
Sorry if i am vague, I can explain more if needed. It currently displays all the bars and rating values, but just once. So it's not functioning the way I want it to.
<?php if(count($languages) > 0) { ?>
<div class="col-md-6">
<ul class="no-bullets">
<?php foreach($languages as $index => $language) { ?>
<li>
<span class="skillset-title"><?= $language->title; ?> (<?= $language->endorsement; ?>)</span>
<span class="skillset-rating">
<?php
$levelpercentage = 0;
for($stars == 1; $stars <= 5; $stars++) {
if ($stars == 5):
echo $levelpercentage = 100;
elseif ($stars == 4):
echo $levelpercentage = 80;
elseif ($stars == 3):
echo $levelpercentage = 60;
elseif ($stars == 2):
echo $levelpercentage = 40;
elseif ($stars == 1):
echo $levelpercentage = 20;
endif;
?>
<div class="progress-bar blue stripes">
<span style="width: <?= ($language->level >= $stars) ? $levelpercentage : '0'; ?>%;"></span>
</div>
<?php } ?>
</span>
</li>
<?php if(ceil(count($languages) / 2) == $index + 1) { ?>
</ul>
</div>
<div class="col-md-6">
<ul class="no-bullets">
<?php } ?>
<?php } ?>
</ul>
</div>
<?php } else { ?>
<div class="alert alert-warning">
No languages were found!
</div>
<?php } ?>
It currently displays all the bars and rating values
That's because you assign and echo your bars and rating values in a for loop.
Your $stars variable is assigned every value from 1 to 5, displaying the bar at each step. Simply remove your for loop and it should work fine (provided you use an already defined $stars variable)
Bonus : Because I'm in a good mood, I have to tell you there's a simpler way to build your $levelpercentage variable than using an if...else for each value from 1 to 5, just use :
$levelpercentage = $stars * 20;
Thank you! That really helped me out. Was trying to simplify what I was trying to do. This is what I did and it seems to be working.
<?php if(count($languages) > 0) { ?>
<div class="col-md-6">
<ul class="no-bullets">
<?php foreach($languages as $index => $language) { $stars = 0; $stars <= 5; $stars++; ?>
<li>
<span class="skillset-title"><?= $language->title; ?> (<?= $language->endorsement; ?>)</span>
<span class="skillset-rating">
<div class="progress-bar blue stripes">
<span style="width: <?= ($language->level >= $stars) ? $language->level * 20 : 0; ?>%;"></span>
</div>
</span>
</li>
<?php if(ceil(count($languages) / 2) == $index + 1) { ?>
</ul>
</div>
<div class="col-md-6">
<ul class="no-bullets">
<?php } ?>
<?php } ?>
</ul>
</div>
<?php } else { ?>
<div class="alert alert-warning">
No languages were found!
</div>
<?php } ?>
Related
I do foreach loop to output my data so my data will be like this
Dog
Cat
Mouse
Bird
Egg
Eagle
Fish
using this code
<div class="col-md-6">
<?php foreach ($treefields as $key=>$item): ?>
<?php if($key==0);?>
<?php if($item['title'] == $estate_data_option_1057): ?>
<div class="additional-amenities">
<span class="available"><i class="fa fa-check-square"></i></span><strong> <?php echo $options_name_1057; ?>:</strong><?php echo $estate_data_option_1057;?></span>
</div>
<?php if (count($item['childs_4']) > 0) foreach ($item['childs_4'] as $child): ?>
<div class="additional-amenities">
<span class="available"><i class="fa fa-check-square"></i></span><strong><?php _che($child['description']); ?></strong><span><?php echo $child['title']; ?></span>
</div>
<?php endforeach; ?>
<?php else: ?>
<?php ?>
<?php endif;?>
<?php endforeach; ?> </div></div>
How can i make it 2 columns like this?
- Dog - Egg
- Cat - Eagle
- Mouse - Fish
- Bird
First count the number of items in your array, then figure out what half of that would be and ceil it, so it's not a float. Then use that value in a conditional to echo your markup to break it into multiple columns.
For example, here is the technique boiled down to put the array into two different ul elements.
<ul>
<?php
$animals = array('Dog','Cat','Mouse','Bird','Egg','Eagle','Fish');
$numAnimals = count($animals);
$maxAnimalsPerColumn = ceil($numAnimals/2);
for($i=0; $i < $numAnimals; $i++) {
echo "<li>".$animals[$i]."</li>";
if ($i+1 == $maxAnimalsPerColumn ) {
echo "</ul><ul>";
}
}
?>
</ul>
$numAnimals would be 7
$maxAnimalsPerColumn would be 4 ($numAnimals divided by 2, ceil'd)
When the loop value (plus 1 since it starts at zero) matches $maxAnimalsPerColumn, it will echo a closing ul tag and a new one to start the second.
The resulting markup would be roughly:
<ul>
<li>Dog</li>
<li>Cat</li>
<li>Mouse</li>
<li>Bird</li>
</ul>
<ul>
<li>Egg</li>
<li>Eagle</li>
<li>Fish</li>
</ul>
Use a counter. Example:
$nbrOfColumns = 2;
$rowsPerColumn = ceil(count($treefields)/$nbrOfColumns);
$counter = 1;
<div class="col-md-6">
foreach ($treefields as $key=>$item){
if($counter === $rowsPerColumn){
echo "</div><div class="col-md-6">";
$counter = 0;
}
(generate your HTML here)
$counter++;
}
</div>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="row text-center">
<?php
if($_GET[id] == 0)
{
$querysb = mysql_query("SELECT * FROM services WHERE parentid !=0 order by parentid, cid ");
}
else
{
$querysb = mysql_query("SELECT * FROM services WHERE parentid='".$_GET[id]."'");
}
while($rowsb = mysql_fetch_assoc($querysb))
{
if($val == '6' || $val =='10'){
$classname = 'whitebg';
} else {
$classname = 'bg-blue co-white';
}
?>
<div class="col-md-4 mrgnBtm15">
<div class="<?php echo $classname;?> padding30" style="min-height: 250px">
<h3 class="service-heading">
<?php echo $rowsb['cname'];?>
</h3>
<h4>
RS <?php echo $rowsb['price'];?><br>
</h4>
<div class="mrgnTop15 clearfix"></div>
<a class="btn bg-orange co-white" href="<?php echo MYWEBSITE;?>servicedetail/<?php echo to_prety_url($rowsb['cname']).'-'.$rowsb['cid'];?>.html">
<font style="size:14px; color:#000; font-weight:bolder;font-family: "Open Sans";">Register</font></a>
</div>
</div>
<?php } ?>
</div>
</div>
</div>
I am working on a dynamic website. here is the code of a particular page. In this page there is a div section with class="col md-4". If the number of content panel in that division appears to 5 or 7 in that case I want only the last panel (i.e 5th and 7th) to be in full column (col-12). What should I do?
Since you are using col-md-4, 3 divs will be shown each row. So I think what you are looking for is a way to make the last div full width if its going to be alone in its row. In that case, you will need to make it col-md-12 on 4th (not 5th) and 7th and 10th records and so on. This is exactly what the following code does,
I think what you want to do is show the
<?php
if($_GET[id] == 0)
{
$querysb=mysql_query("SELECT * FROM services WHERE parentid !=0 order by parentid, cid ");
}
else
{
$querysb=mysql_query("SELECT * FROM services WHERE parentid='".$_GET[id]."'");
}
$number_of_records = mysql_num_rows($querysb);
$counter = 1;
while($rowsb=mysql_fetch_assoc($querysb))
{
if($val == '6' || $val =='10'){
$classname= 'whitebg';
}else{
$classname= 'bg-blue co-white';
}
//if($number_of_records %3 ==1 && $counter == $number_of_records)
if(($number_of_records == 5 || $number_of_records == 7) && $counter == $number_of_records)
$col_class = "col-md-12";
else
$col_class = "col-md-4";
?>
<div class="<?php echo $col_class;?> mrgnBtm15">
<div class="<?php echo $classname;?> padding30" style="min-height: 250px">
<h3 class="service-heading">
<?php echo $rowsb['cname'];?>
</h3>
<h4>
RS <?php echo $rowsb['price'];?><br>
</h4>
<div class="mrgnTop15 clearfix"></div>
<a class="btn bg-orange co-white" href="<?php echo MYWEBSITE;?>servicedetail/<?php echo to_prety_url($rowsb['cname']).'-'.$rowsb['cid'];?>.html">
<font style="size:14px; color:#000; font-weight:bolder;font-family: "Open Sans";">Register</font></a>
</div>
</div>
<?php
$counter++;
} ?>
</div>
</div>
</div>
I've got a while loop that displays 50 logos. But what I need is another loop that creates a new div(.autogrid_wrapper .cte .block) every 5 images.
<?php
$cn = 1;
while($result->next()) {
if ($cn % 5 == 0) {
?>
<div class="autogrid_wrapper cte block">
<div class="inner">
<?php } ?>
<div class="ce_card autogrid-type_cte n5 one_fifth autogrid_mode_auto autogrid <?php echo $class2; ?> <?php echo $class; ?> block">
<div class="card_wrapper">
<a class="download_image" title="<?php echo $result->name; ?>"
<div class="ce_image attribute image">
<div class="ce_image block">
<figure class="image_container">
<img src="<?php echo $imageVar->path; ?>" onerror="this.onerror=null; this.src='files/Intershop/media/images/customers/<?php echo $rest; ?>.png'" title="<?php echo $entry->field('name')->value(); ?>" alt="<?php echo $entry->field('name')->value(); ?>" >
</figure>
</div>
</div>
</a>
</div>
</div>
<div class="clear autogrid_clear"></div>
<?php if ($cn % 5 == 0) { ?>
</div>
</div>
<?php
}
$cn++;
?>
<?php } ?>
I hope you guys can help me.
Ok , after ask you in comments I know what's your purpose.
You wanna print div(.autogrid_wrapper .cte .block) before 1st item and close this div after while walk through 5th item and so on.
$cn = 1;
while($result->next()) {
if($cn % 5 == 1) {
//div(.autogrid_wrapper .cte .block)
}
// HTML wraps image
if($cn % 5 == 0) {
//print the close tag of div(.autogrid_wrapper .cte .block)
}
$cn ++;
}
Embed this flow control in your code, I think this will work.
Try with this hope it's helps
<?php
$cn = 1;
while($result->next()) {
if ($cn % 5 == 0) { //check if number is divided by 5 like 5,10,15 etc
//new div'
}
YOUR HTML
if ($cn % 5 == 0) {
//close div'
}
$cn++;
} ?>
I have a list of blocks to print in my web page. Data of these blocks are stored in a database like this:
Priority column corresponds to the priority id to print blocks order by ascendant priority id. Size column corresponds to the size of the block (0 or 1), 0 for half width of the page and 1 for full width of the page.
The blocks can be added dynamically, currently the first half width block positions on the left (float: left) and the next block on the right, any problem for the full width blocks.
My problem is when I have 4 half width blocks successive, I have this display:
Here my code:
<?php
$i = 1;
foreach (Block::getAll($diagnostic) as $block)
{
if ($block['size'] == 0)
{
$size = 6;
if (Block::get($diagnostic, $block['priority'] + 1, 'size') == 0 && Block::get($diagnostic, $block['priority'] + 1, 'size') != null)
{
?>
<div class="row">
<div class="cols-<?php echo $size; ?> blocks">
<div class="header"><h3>Titre <?php echo Block::get($diagnostic, $block['priority'], 'priority'); ?></h3></div>
<div class="body">
<p>Texte <?php echo Block::get($diagnostic, $block['priority'], 'priority'); ?></p>
</div>
</div>
<div class="cols-<?php echo $size; ?> blocks">
<div class="header"><h3>Titre <?php echo Block::get($diagnostic, $block['priority'] + 1, 'priority'); ?></h3></div>
<div class="body">
<p>Texte <?php echo Block::get($diagnostic, $block['priority'] + 1, 'priority'); ?></p>
</div>
</div>
</div>
<?php
}
else if (Block::get($diagnostic, $block['priority'] + 1, 'size') != 0 && Block::get($diagnostic, $block['priority'] - 1, 'size') != 0)
{
?>
<div class="row">
<div class="cols-<?php echo $size; ?> blocks">
<div class="header"><h3>Titre <?php echo $block['priority']; ?></h3></div>
<div class="body">
<p>Texte <?php echo $block['priority']; ?></p>
</div>
</div>
</div>
<?php
}
}
else
{
$size = 12;
?>
<div class="row">
<div class="cols-<?php echo $size; ?> blocks">
<div class="header"><h3>Titre <?php echo $block['priority']; ?></h3></div>
<div class="body">
<p>Texte <?php echo $block['priority']; ?></p>
</div>
</div>
</div>
<?php
}
++$i;
}
In pleasure to read you.
Problem solved.
I deleted the container and I added display-block attribute to my blocks with 50% width for half blocks and 100% width for full blocks.
PHP side, I get the size value from the database and I push the half class or full class according this data.
I have my markup structure as below:
<div>
<div>value1</div>
<div>value2</div>
<div>value3</div>
<div>value4</div>
<div class="clear"></div>
</div>
<div>
<div>value5</div>
<div>value6</div>
<div>value7</div>
<div>value8</div>
<div class="clear"></div>
</div>
I have my data in a PHP result set, let's say I have 9 records so the structure should be as below:
<div>
<div>value1</div>
<div>value2</div>
<div>value3</div>
<div>value4</div>
<div class="clear"></div>
</div>
<div>
<div>value5</div>
<div>value6</div>
<div>value7</div>
<div>value8</div>
<div class="clear"></div>
</div>
<div>
<div>value9</div>
<div class="clear"></div>
</div>
So, the while loop should run in a way so that it will print the parent div after 4 records printed successfully. But in above I have 9 records so it should close the dive if its the last record.
Please help, Thanks!
The preconfig...
<?php
$num_of_results = sizeof($your_array);
$loops = ceil($num_of_results/4);
$k = 0;
?>
In your web
<?php for($p = 0; $p < $loops; $p++) { ?>
<div>
<div>
<?php for($i = 0; $i < 4 && $k < $num_of_results; $i++) { ?>
<div><?php echo $your_array[$k]; $k++;?></div>
<?php } ?>
<div class="clear"></div>
</div>
</div>
<?php } ?>
That's your problem isnt it?
By getting some idea from logic given here I tried following and it works.
<div> <!-- started main div -->
<?php
$icount = 1;
$itotal = mysql_num_rows($result_rs);
while ($rs = mysql_fetch_array($result_rs)) {
echo '<div>'.$rs['value'].'</div>';
if ($icount % 4 == 0 && $icount != $itotal){
echo '<div class="clear"></div>';
echo '</div>'; //closed main div
echo '<div>'; //started new main div
}
$icount++;
}
?>
</div> <!-- closed main div -->
That, solved my problem.
Edited: added itotal condition, so when you will have only 4 records per page then also this will work properly.
Right, now I know what you're after. I've done this before when showing items in a grid and you need to break each row because of that browser.
Anyway, it's ugly but I don't think it gets any easier than this
<?php for ($i = 0, $total = count($resultSet); $i < $total; $i += 4) : ?>
<div>
<?php
for ($j = $i; $j < ($i + 4); $j++) :
if (!isset($resultSet[$j])) :
?>
<div class="clear"></div>
</div>
<?php break 2; endif ?>
<div><?php echo htmlspecialchars($resultSet[$j]) ?></div>
<?php endfor ?>
<div class="clear"></div>
</div>
<?php endfor ?>
<div>
<?php for ($i = 1; $i <= 9; $i++): ?>
<?php if ($i%4 == 1 && $i != 1): ?>
<div class="clear"></div>
</div>
<div>
<?php endif; //$i%4 == 1 && $i != 1 ?>
<div>Value <?php echo $i ?></div>
<?php endfor; //$i = 1; $i <= 9; $i++ ?>
<div class="clear"></div>
</div>
or with an array:
<div>
<?php foreach ($arr as $k=>$v): ?>
<?php if (($k+1)%4 == 1 && $k != 0): ?>
<div class="clear"></div>
</div>
<div>
<?php endif; //($k+1)%4 == 1 && $k != 0 ?>
<div><?php echo $v ?></div>
<?php endforeach; //$arr as $k=>$v ?>
<div class="clear"></div>
</div>
or with a mysqli resultset:
<div>
<?php $count = 1 ?>
<?php while ($row = mysqli_fetch_array($result)): ?>
<?php if ($count%4 == 1 && $count != 1): ?>
<div class="clear"></div>
</div>
<div>
<?php endif; //$count%4 == 1 && $count != 1 ?>
<div><?php echo $row['value'] ?></div>
<?php $count++ ?>
<?php endwhile; ?>
<div class="clear"></div>
</div>
Why not use modulo to "close" a div?
<div>
<?php foreach($data as $key => $value) : ?>
<div><?php echo $value ?></div>
<?php if($key % 4 == 0 && $key != 0) : // add a clearing div, close the first group and open another one ?>
<div class="clear"></div>
</div>
<div>
<? endforeach ?>
<?php if($key % 4 != 0) : // div has not been closed as the number of records % 4 was not equal 0 ?>
<div class="clear"></div>
</div>
<? endif ?>