I am having trouble creating a solution that will target the end row of a MySQL query. Currently I have a foreach function that works through the query and displays each one as a div with the information inside:
<?php $residents = Resident::find_all();
foreach($residents as $resident): ?>
<div class="submenu">
<p class="menuitem submenuheader"><?php echo $resident->name; ?></p>
<img src="images/<?php echo $resident->image_path(); ?>" width="250" class="image" />
<p><?php echo $resident->info; ?></p>
</div>
.submenu currently has a bottom border. I need to remove this on the last row returned. I have looked at DESC LIMIT 1, however this requires another MySQL query and could make things very messy...
Addd this to your CSS:
.submenu:last-child { border-bottom: 0; }
Note: this is not supported by IE < 9.
You could switch to putting the border on the top of the element, and use the :first-child pseudo selector in CSS to remove it.
http://reference.sitepoint.com/css/pseudoclass-firstchild
The :last-child selector would be nice, but it's not supported in IE before version 9, so it's not a good idea to use it if you want compatibility.
If you separate your HTML and PHP a little this is easily achieved:
<?php
function echoBlock($resident,$pClass="menuitem submenuheader") {
echo "<div class=\"submenu\">\n<p class=\"$pClass\">\n";
echo $resident->name;
echo "</p>\n<img src=\"images/";
echo $resident->image_path();
echo "\" width=\"250\" class=\"image\" />\n<p>";
echo $resident->info;
echo "</p>\n</div>\n\n";
}
$residents = Resident::find_all();
$last=count($residents)-1;//2 element array last pos is 1
for ($i=0;$i<$last;$i++) {
echoBlock($residents[$i]);
}
echoBlock($residents[$last],"menuitem");
?>
echoBlock (which could easily be a method on a class) requires the calling code to know about the classes it uses, which isn't really separating intent but it does prevent the need for an if branch on every loop. That being said it would be less efficient but perhaps more usable to set it up as:
function echoBlock($resident,$isLast=false) {
$pClass="menuitem".($isLast?"":" submenuheader");
//...
Which then doesn't need the caller to know anything about what echoBlock does.
You could try and pop the array using array_pop(), to get the last value out of the array and then inputing it using the special class after the foreach loop.
What about
Instead of echo'ing each line one by one, create one big string in PHP, search for the last entry of "submenu" and change the class.
Related
I have a wordpress function that displays adverts every so often. When are not shown essentially I would prefer to the div to display:none;
I can not seem to figure out the correct PHP function in order for the div not to display when a advert is uploaded.
<div class="advert" <?php if(!empty($_GET['details'])) {echo "style='display: none'";} ?>></div>
Why not completely not echo "advert" element?
if ( !empty($_GET['details']) ){
echo '<div class="advert">add text</div>';
}
if you really want to just hide, you can assign hide class
<div class="advert <?php echo ( empty($_GET['details'])? 'hide' : '' );">add text</div>
then you would need to add "hide" class with display:none in your style.css
Above is shorthand/ternary if/else statement used, its great if you need output some string.
And, please don't output/trust any user input i.e. $_GET['details'] 'as is' anywhere without escaping it, for security reasons.
Wordpress have plenty easy-to-use escape functions, like esc_attr() and esc_html().
This should do it for you
<?php
$advert_display_string = "";
if (!isset($_GET['details'])) {
$advert_display_string = "style='display: none'";
}
?>
<div class="advert" <?php echo $advert_display_string ; ?> ></div>`
but having said that, instead of displaying it and then hiding it with css, you could just choose only to display it if you need it there, like below
<?php
if (isset($_GET['details'])) {
?>
<div class="advert"></div>
<?
}
?>
I am trying to give every second div in my container a different background color compared to the first one. The issue I have is, that there is a JavaScript code in between the divs. Here is an example:
echo '<div class="holder">';
echo '<script type="text/javascript"></script>';
echo '<div class="list_item"></div>';
echo '<script type="text/javascript"></script>';
echo '<div class="list_item"></div>';
echo '<script type="text/javascript"></script>';
echo '<div class="list_item"></div>';
echo '<script type="text/javascript"></script>';
echo '<div class="list_item"></div>';
echo '<script type="text/javascript"></script>';
echo '<div class="list_item"></div>';
echo '</div>';
When I now add the following css code:
.holder .list_item:nth-child(even) {
background-color:#fff;
}
it will give all of the divs the white background color.
Does anyone have an idea how to solve this???
P.S: I changed the css code to nth-child(odd) as well to test it. But that didn't work either.
You need nth-of-type instead of nth-child. This will only take <div> tags into account, regardless of what is in between of them.
The :nth-child() pseudo-class will count all siblings sharing the same parent.
Since you have multiple element types in the container, and you are targeting only the divs, you can skip over the script elements by using :nth-of-type() instead.
:nth-of-type() matches only elements of the same type.
So when you say:
I am trying to give every second div in my container a different background color compared to the first one.
Try something like this:
div:nth-of-type(even)
There are two child elements per entry. There is a script child and a div child. You could either address the divs using :nth-child(4n+1) (or +3 for even), or you could use the :nth-of-type selector to just address the div elements:
:nth-of-type(odd / even) {…}
I have my data being output to a span currently... this is how it looks:
Now, when i remove the span and place a div there i am given this output:
This is desired, but I want to set a height to my page and have the data show up in as little as 3 columns. How would I do this? I have searched everywhere online but can't seem to find anything that shows a solution.
I did read that some use javascript for the format but i am still clueless on even this option.
My desired output would look like this:
If you know how many items you want in a column then you can seperate them out into individual divs and then float those divs to the left to get them to be next to each other.
<div style='float:left'>
//Items go here
</div>
<div style='float:left'>
//Items go here
</div>
etc.
If you figure out how many items your query returned, say using mysql_num_rows() and divide by 3 you can tell how many to put in each column.
Also be sure to clear the floats afterwards, so like this:
<div style="clear:both"></div>
Sometimes this is necessary as there will be random issues if this is not put there.
What you are describing can be solved with styling only. You have several divs that must be displayed in columns. The easiest way is floating them to the left, and setting the width for 1/3 of the parent. If you want 4 columns, set the with to 1/4 of the parent, and so on.
<div class='sqlResult' style="float:left;width:33%;">
<a href='#'>$key</a>
</div>
Also as other answers mentioned, don't use duplicated ids. Always use classes. If you need to target each div individually, give it a unique id, such as "category_1", "category_2", and so on.
This should work
<table><tr>
<?php $count=0; $total=mysqli_stmt_num_rows($sql)-1; $idxcount=0; $limit=10; while($row = mysqli_fetch_array($sql)): $key = $row['Keyword_Name']; ?>
<?php if($count == 0){ echo '<td>';} ?>
<span>
<?php echo $key; ?>
</span>
<?php if($total == $idxcount): ?>
</td>
<?php elseif($count == $limit): ?>
</td>
<?php $count=0; else: $count++; ?>
<?php endif; $idxcount++; ?>
<?php endwhile; ?>
</tr></table>
I am trying to get desks highlighted that are available based off of a form that asks for the the day, time start and time end. I am able to echo out all the desks that are available, but I cant get the jquery to work with it.
foreach ($allData as $desk => $id){
foreach ($id as $computer){?>
<div id="<?php echo $desk?>"></div><?php
}
}
<style>
.availableDesk{
background: #000000
}
</style>
<script>
$(document).ready(function() {
jQuery( " <?php echo $desk ?> " ), addClass('availableDesk') ;
})
</script>
DESKS:
<ul class="tabs">
<li id="1A"><div id="ddesk"></div></li>
<li id="1B"><div id="ddesk"></div></li>
<li id="1C"><div id="ddesk"></div></li>
</ul>
You're missing the ?> at the end of your PHP block.
<?php
foreach ($allData as $desk => $id){
foreach ($id as $computer){?>
<div id="<?php echo $desk?>"></div><?php
}
} // You need a "?>" here
?>
There are a few things wrong with your jQuery code. First off, if $desk is an ID, you need to do $('#ID'). Second, you have a comma before addClass instead of a period.
jQuery("#<?php echo $desk ?>").addClass('availableDesk');
P.S. HTML ID's aren't supposed to start with a number. Also, you cannot have multiple elements with the same ID, I suggest you use classes instead.
I can see a couple of potential issues here...
jQuery( "<?php echo $desk ?>" ), addClass('availableDesk') ;
Syntactically, I think this should be:
jQuery("#<?php echo $desk ?>").addClass('availableDesk');
Note the # in the selector, this tells jQuery that you are looking for an id. The addClass method is available on the returned items, so you need a stop (.) not a comma (,)
The other gotcha is that you are writing the id in a foreach loop in PHP - I presume that each desk has a unique id - when you write jQuery("#<?php echo $desk ?>") the statement is outside of the foreach loop, so it won't match the ids you are targeting.
If you know that the desk is available in PHP, the best option would be to set the class as you write the desk...
<div id="<?php echo $desk?>" class="availableDesk"></div>
I am building a picture gallery, that uses this code to display each product I have:
<div class="feature">
<imagetag alt="Image Caption"srcs="">
<div>
<p>
This is some information that can go along with an image.
Anything can be placed here, including images.
</p>
</div>
</div>
I need to create a while loop, that takes all the products in my database, and creates a div of the "feature" class for every instance. I have problems know exactly which symbols need to be escaped and etc. Your help is greatly appreciated.
here is my start:
<?php
($product_set = mysql_fetch_assoc($query)) {
print("<div class="feature"> <imagetage alt="Image Caption" srcs=$product_set[products_image]>"
);}
?>
If you are in a string, every doublequote should be escaped. Because it will close your string.
<?php
($product_set = mysql_fetch_assoc($query))
{
print "<div class=\"feature\"><img alt=\"Image Caption\" src=" . $product_set['products_image'] . ">";
}
?>
Fun thing is, I got a link from someone on stackOverflow about PHP templating. Which was using Smarty. So you don't have to use these print states anymore.
Have you tried:
print(htmlentities($my_html_string))
or htmlspecialchars? htmlentities converts all characters that have one to their HTML escape sequence, while htmlspecialchars converts only those that have meaning in HTML.