Jump to content

Foreach Sorting Issue On Calling From Database

JLitkie

By JLitkie
in PHP Coding Help

Recommended Posts

JLitkie Member

JLitkie

Posted
Posted

Hi,

 

Im trying to call from a database and have it put it in a set of divs and paragraphs. After three sets it puts in a set of code and repeats the previous divs sets but with continued information called from the database. A copy of the code ii have and the original code is below.

 

current code:


<!DOCTYPE html>
<html lang="en">
 <head>
   <meta charset="utf-8">
  <meta name="dcterms.created" content="Tue, 13 Nov 2012 21:07:39 GMT">
   <meta name="description" content="">
   <meta name="keywords" content="">
   <title></title>

   <!--[if IE]>
   <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
   <![endif]-->
 </head>
 <body>
 <?php
 include 'db_connect.php';

 mysql_select_db("xxxxxxxxxxxxx", $con);

$result = mysql_query("SELECT * FROM image_info");

$i = 0;
while($row = mysql_fetch_array($result))
{
$i++;

$additionalClass = ($i % 3) == 0 ? " last" : "";
echo "<div class='photo m_bot1" . $additionalClass . "'>";

echo "<div class='photo m_bot1'>
<p>
<a href='#' class='img_wrap'><img src='$row[3]' width='286' height='268' alt='photo1' /></a>
</p>
<a href='#'><span class='white'>$row[2]</span><br>
$row[1]</a>
</div>";


} 

?>
 </body>
</html>

 

old code:


<!DOCTYPE html>
<html lang="en">
<head>
   <title>Photos</title>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width; initial-scale=1.0">
   <link rel="icon" href="images/favicon.ico" type="image/x-icon">
   <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css">
   <script type="text/javascript" src="js/jquery-1.7.min.js"></script>
   <script type="text/javascript" src="js/superfish.js"></script>
<script type="text/javascript" src="js/jquery.responsivemenu.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.elastislide.js"></script>
<!--[if lt IE 8]>
  <div style=' clear: both; text-align:center; position: relative;'>
    <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode">
      <img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
   </a>
 </div>
<![endif]-->
   <!--[if lt IE 9]>
   <script type="text/javascript" src="js/html5.js"></script>
    <link rel="stylesheet" type="text/css" media="screen" href="css/ie.css">
   <![endif]-->
</head>
<body>
<div class="main">
<nav>
<div class="container_12">
<ul class="sf-menu">
<li class="sf-with-ul"><a href="index.html">home</a>
<ul>
<li><a href="#">Annual Passes</a></li>
<li><a href="#">Oceans Society</a></li>
<li><a href="#">Sponsors</a>
<ul>
<li><a href="#">Aquarium Events</a></li>
<li><a href="#">Neon Tetras</a></li>
<li><a href="#">Mollies</a></li>
<li class="bd_none"><a href="#">Species</a></li>
</ul>
</li>
<li class="bd_none"><a href="#">Swordtails</a></li>
</ul>
</li>
<li><a href="index-1.html">about</a></li>
<li class="current"><a href="index-2.html">photos</a></li>
<li><a href="index-3.html">club info</a></li>
<li><a href="index-4.html">fish</a></li>
<li><a href="index-5.html">contact us</a></li>
</ul>
<form id="search" action="search.php" method="GET" accept-charset="utf-8">
<input type="text" name="s" />
<a onclick="document.getElementById('search').submit()"></a>
</form>
<div class="clear"></div>
</div>
</nav>
<!--==============================header=================================-->
<header>
<div class="container_12">
<h1><a class="logo" href="index.html">Aquamarine</a></h1>
<div class="social">
<a href="#" title="Facebook"><img src="images/soc1.png" width="23" height="46" alt=""></a>
<a href="#" title="RSS"><img src="images/soc2.png" width="23" height="46" alt=""></a>
<a href="#" title="Google +"><img src="images/soc3.png" width="23" height="46" alt=""></a>
<a href="#" title="Twitter"><img src="images/soc4.png" width="23" height="46" alt=""></a>
</div>
<div class="clear"></div>
</div>
</header>
<!--==============================content================================-->
<section id="content">
<div class="container_12">
<div class="wrapper">
<article class="grid_12">
<h2 class="ind2">Our photos</h2>
<div class="car_box">
<div id="carousel" class="es-carousel-wrapper">
<div class="es-carousel">
<ul>
<li class="first_it">
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo1.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Sed ut perspiciatis</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo4.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Aliquam erat volutpat</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo">
<p>
<a href="#" class="img_wrap"><img src="images/photo7.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Duis ultricies</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
</li>
<li class="first_it">
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo2.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Mauris accumsan nulla</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo5.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Integer rutrum</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo8.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Maecenas tristique</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
</li>
<li class="first_it">
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo3.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Nulla facilisi</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo6.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Nam elit magna, hendrerit</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo9.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Donec accumsan malesuada </span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
</li>
<li class="first_it">
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo1.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Sed ut perspiciatis</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo4.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Aliquam erat volutpat</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo">
<p>
<a href="#" class="img_wrap"><img src="images/photo7.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Duis ultricies</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
</li>
<li class="first_it">
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo2.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Mauris accumsan nulla</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo5.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Integer rutrum</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo8.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Maecenas tristique</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
</li>
<li class="first_it">
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo3.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Nulla facilisi</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo6.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Nam elit magna, hendrerit</span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
<div class="photo m_bot1">
<p>
<a href="#" class="img_wrap"><img src="images/photo9.jpg" width="286" height="268" alt="photo1" /></a>
</p>
<a href="#"><span class="white">Donec accumsan malesuada </span><br>
Donec vestibulum, eros sed adipiscing aliquet, magna mauris ultrices mi, in vestibulum ligula dolor eu nibhsi. Ut sollicitudin lectus nec libero porta dignissim.</a>
</div>
</li>
</ul>
</div>
</div>
</div>
</article>
</div>
</div>
</section>
<!--==============================footer=================================-->
<footer>
Aquamarine  © 2012  |   <a href="index-6.html">Privacy Policy</a>
</footer>
</div>
</body>
</html>

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.