How to get pictures to start on a new line

thereaper87 · August 21, 2010

Hello there,

I am working on a pagination script and have hit a bit of a wall. Here is the script:

<?php include("header.php"); ?>
<?php


$host = "localhost"; //

$user = ""; //username to connect to database

$pass = ""; //password to connect to database

$db = ""; //the name of the database



mysql_connect($host,$user,$pass) or die("ERROR:".mysql_error());

mysql_select_db($db) or die("ERROR DB:".mysql_error()); 





$max = 25; //amount of articles per page.

$p = $_GET['p'];

if(empty($p))

{

$p = 1;

}

$limits = ($p - 1) * $max; 

//view the article!

if(isset($_GET['act']) && $_GET['act'] == "view")

{

$id = $_GET['id'];

$sql = mysql_query("SELECT * FROM 3dpics WHERE id = '$id'");

while($r = mysql_fetch_array($sql))

{

$title = $r['title'];

$url = $r['url'];


echo "<div align='center'><img src='$url' width='500' height='500'><br />$title<br /><br /><a href='test.php'>Back</a></div>";

}



}else{



//view all the articles in rows

$sql = mysql_query("SELECT * FROM 3dpics LIMIT ".$limits.",$max") or die(mysql_error());

//the total rows in the table

$totalres = mysql_result(mysql_query("SELECT COUNT(id) AS tot FROM 3dpics"),0);	


$totalpages = ceil($totalres / $max);
    
echo "<table name='myTable' cellpadding='5' cellspacing='5'>";
echo "<tr>";
//the table


while($r = mysql_fetch_array($sql))

{

$id = $r['id'];

$title = $r['title'];

$url = $r['url'];
echo "<div id='piccontentalign' align='center'>";
echo "<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>";
}
echo "</tr></table></div>";
//close up the table


for($i = 1; $i <= $totalpages; $i++){ 

//this is the pagination link

echo "<a href='test.php?p=$i'>$i</a>|";

}

}



?>

All this does is pull the url's of the images out of the database. But, it all shows up on 1 line across the screen! I tried echoing the rows instead, but then it just shows up as 1 line going horizontal. So i'm trying to figure out a way to get 5 pictures per row.

This is the code that displays them on the main page:

echo "<table name='myTable' cellpadding='5' cellspacing='5'>";
echo "<tr>";
//the table


while($r = mysql_fetch_array($sql))

{

$id = $r['id'];

$title = $r['title'];

$url = $r['url'];
echo "<div id='piccontentalign' align='center'>";
echo "<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>";
}
echo "</tr></table></div>";
//close up the table

Thanks for all your help!

thereaper87 · August 21, 2010

I have tried this:

<?php echo $r['url']; ?><br />
<?php echo $r['title']; ?>

But that will not work either.

:facewall:

Spriced · August 21, 2010

You need to use the modulus operator to add table rows. Something like this:

<?php
$numCols = 5;
$counter = 1;

echo "<table>";
echo "<tr>";

while(...) {

echo "<td>Cell content</td>"

if ($resultNum % $numCols == false) {
	echo "</tr>";
	echo "<tr>";
} // end if

} // end while

echo "</tr>";
echo "</table>";

?>

I've simplified it a bit to try and make it clearer.

Here is another very simple example of the modulus operator:

<?php
for ($i = 1; $i < 50; $i++) {
echo "<p>$i</p>";

if ($i % 5 == false) {
	// This will appear every 5 lines
	echo "<b>++++++++++</b>";
}
}
?>

Make sure the counter doesn't start at 0 because then the code in if statement will run as it will be true.

http://php.net/manual/en/language.operators.arithmetic.php

thereaper87 · August 21, 2010

Thank you for the reply! Here is what I've changed the code to:

$numCols = 5;
$counter = 1;

echo "<table>";
echo "<tr>";
//the table


while($r = mysql_fetch_array($sql))

{

$id = $r['id'];

$title = $r['title'];

$url = $r['url'];
echo "<td>Cell content</td>";
echo "<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>";

if ($resultNum % $numCols == false) {
	echo "</tr>";
	echo "<tr>";
} // end if

} // end while

echo "</tr>";
echo "</table></div>";

Is this correct? I hope not. It is just displaying a single horizontal line down the page.

Spriced · August 21, 2010

I forgot to add the counter incrementation to the end of the while loop :

$numCols = 5;
$counter = 1;

echo "<table>";
echo "<tr>";
//the table


while($r = mysql_fetch_array($sql))

{

$id = $r['id'];

$title = $r['title'];

$url = $r['url'];
echo "<td>Cell content</td>";
echo "<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>";

if ($resultNum % $numCols == false) {
	echo "</tr>";
	echo "<tr>";
} // end if

$counter++; // This line

} // end while

echo "</tr>";
echo "</table></div>";

thereaper87 · August 21, 2010

Still one horizontal line :confused:

Should I move

echo "<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>";

That line somewhere else? Inside this IF statement maybe?

jcbones · August 21, 2010

Check against $counter, not $resultNum

$numCols = 5;
$counter = 1;

echo "<table>";
echo "<tr>";
//the table

while($r = mysql_fetch_array($sql))  {

$id = $r['id'];
$title = $r['title'];
$url = $r['url'];
echo "<td>Cell content</td>";
echo "<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>";
if ($counter % $numCols == 0) {
echo "</tr>";
echo "<tr>";
} // end if

$counter++; // This line

} // end while

echo "</tr>";
echo "</table></div>"

Spriced · August 21, 2010

This should work:

<?php
$host = "localhost"; //

$user = ""; //username to connect to database

$pass = ""; //password to connect to database

$db = ""; //the name of the database

mysql_connect($host,$user,$pass) or die("ERROR:".mysql_error());

mysql_select_db($db) or die("ERROR DB:".mysql_error()); 

$max = 25; //amount of articles per page.

$p = $_GET['p'];

if(empty($p)) {
$p = 1;
}

$limits = ($p - 1) * $max; 

//view the article!

if(isset($_GET['act']) && $_GET['act'] == "view") {
$id = $_GET['id'];
$sql = mysql_query("SELECT * FROM 3dpics WHERE id = '$id'");

while($r = mysql_fetch_array($sql)) {
	$title = $r['title'];
	$url = $r['url'];
	echo "<div align='center'><img src='$url' width='500' height='500'><br />$title<br /><br /><a href='test.php'>Back</a></div>";
}



} else {

//view all the articles in rows
$sql = mysql_query("SELECT * FROM 3dpics LIMIT ".$limits.",$max") or die(mysql_error());

//the total rows in the table
$totalres = mysql_result(mysql_query("SELECT COUNT(id) AS tot FROM 3dpics"),0);	

$totalpages = ceil($totalres / $max);

//
$numCols = 5;
$counter = 1;
//

echo "<table name='myTable' cellpadding='5' cellspacing='5'>";
echo "<tr>";

//the table
while($r = mysql_fetch_array($sql)) {
	$id = $r['id'];
	$title = $r['title'];
	$url = $r['url'];
	echo "<div id='piccontentalign' align='center'>";
	echo "<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>";

	//
	if ($counter % $numCols == false && $counter != $max) {
		echo "</tr>";
		echo "<tr>";
	}

	$counter++;
	//
}

echo "</tr></table></div>";

//close up the table
for($i = 1; $i <= $totalpages; $i++) {
//this is the pagination link
	echo "<a href='test.php?p=$i'>$i</a>|";
}
}
?>

The extra lines I added are in between empty comments. I also added an extra argument in the if statement to prevent an extra table row being added on the end.

It should give you markup something like:

<table name='myTable' cellpadding='5' cellspacing='5'>
<tr>

<!-- while loop -->
	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

<!-- if statement -->
</tr>
<tr>
<!-- end if statement -->

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

<!-- if statement -->
</tr>
<tr>
<!-- end if statement -->

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>

	<div id='piccontentalign' align='center'>
	<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>
<!-- endwhile loop -->

</tr>
</table>

Spriced · August 21, 2010

Also, on a side note, your code has a couple of other small errors :examine: :

echo "<div id='piccontentalign' align='center'>";
echo "<td><img src='$url' width='225' height='225'><br /><div align='center'><a href='test.php?act=view&id=$id'>$title</a></div></td>";
echo "</div>"; // This closes the <div id='piccontentalign' align='center'>. But wrapping a table cell in a div isn't valid, I'm sure you don't need it

} // end while
echo "</tr></table></div>"; // The </div> is erroneous

thereaper87 · August 21, 2010

Thank you so much! It works like a dream! I have accredited you on the page.

Thanks again :thumb-up:

Sign In

How to get pictures to start on a new line

Recommended Posts

thereaper87

Link to comment

Share on other sites

thereaper87

Link to comment

Share on other sites

Spriced

Link to comment

Share on other sites

thereaper87

Link to comment

Share on other sites

Spriced

Link to comment

Share on other sites

thereaper87

Link to comment

Share on other sites

jcbones

Link to comment

Share on other sites

Spriced

Link to comment

Share on other sites

Spriced

Link to comment

Share on other sites

thereaper87

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information