Jump to content

Archived

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

Bhaal

Columns question revisited

Recommended Posts

I know - I've asked this before, and the responses were quite helpful, but I think the issue is more complicated than it appears at first blush.

I'm trying to recreate the columnar layout of this page:

[a href=\"http://www.convictmailbag.com/prisoner_list.php\" target=\"_blank\"]http://www.convictmailbag.com/prisoner_list.php[/a]

Names are pulled from a db and layed out in nice, neat columns across the page.

I realize that each name is formatted with CSS, but I don't believe the actual layout is achieved with CSS alone.

For instance, how are the columns breaking after 76(?) records and forming a new column at the top of the page?

It's been suggested that the columns do not go top to bottom, but left to right; an examination of the source reveals this to not be true: the columns do indeed go top to bottom and break after X number of records to begin a new column.

I do know that each name is formatted with CSS to give it a background and a hover effect, but the code is written such that each column contains 76(?) names, then a </td><td align="center"> is somehow inserted which creates a new column starting at the top of the container. (Plus a cool conditional that formats male/female entries differently.) This eliminates the need for pagination. If this is done with a 'limit' somehow, and more records are entered this limit can be increased so that each column contains more names. Pretty nice, eh?

So...

How are these columns created? It has to be in the PHP code...right? And how is CSS styling being applied conditionally?

I'd say this would be a challenge for even a moderately experienced code, much less a newbie like me :-)

Any help/insight would be greatly appreciated!!!!

Thanks...

_Bhaal

Share this post


Link to post
Share on other sites
after examining the code, it appears that they simply have a table with 5 cells. inside each of those cells, they simply echo out the 75 or so prisoners' names they want listed there. the actual links themselves are simply styled to allow for the "button" look they have. you'll notice that at the end of each of the columns, you'll have a "</td><td align='center'>" before the next column starts. that's all they're doing to break the columns up.

after a little more thinking, i figure i'd just write up this simulation for you to show how easily such an effect can be achieved:
[code]
<?php
$limit = 250;
$columns = 50;
$i = 0;
$out = "<table border='0' cellpadding='0' cellspacing='0'>\n" .
             "<tr>\n";
            
while ($i < $limit) {
    if ($i % 50 == 0)
        $out .= "<td align=\"center\">\n";
    $i++;
    $out .= "<a href='#'>$i</a>\n";
    if ($i % 50 == 0)
        $out .= "</td>\n";
}

$out .= "</tr>\n" .
                "</table>\n";
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type='text/css'>
body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
}

table {
    border: 1px solid #cccccc;
}

td {
    border: 1px solid #cccccc;
}

td a {
    display: block;
    width: 100px;
}
</style>
</head>

<body>
<?= $out ?>
</body>
</html>

[/code]

hope this helps

Share this post


Link to post
Share on other sites
At the risk of being ridiculed for being such a damn newbie at this - I'm quite embarrassed to ask publicly.

But I AM such a damn novice with this stuff - I have no idea how to 'combine' your array (that works very well - thanks again!) with a query.

A simple query like this:

$authors = @mysql_query('SELECT ID, Name FROM Authors');
if (!$authors) {
die('<p>Error retrieving authors from database!<br />'.
'Error: ' . mysql_error() . '</p>');
}

while ($author = mysql_fetch_array($authors)) {
$id = $author['ID'];
$name = htmlspecialchars($author['Name']);

echo("<a href='editauthor.php?id=$id' class='navbutton'>$name</a>");

}

This just echos out a link for each entry in the array, while 'class='navbutton' supplies the formatting.

But how would one combine your rather elegant 'columns' solution with this (or any other) query?

If one doesn't ask, one doesn't learn...right?

Share this post


Link to post
Share on other sites
[!--quoteo(post=355444:date=Mar 15 2006, 02:36 PM:name=Bhaal)--][div class=\'quotetop\']QUOTE(Bhaal @ Mar 15 2006, 02:36 PM) [snapback]355444[/snapback][/div][div class=\'quotemain\'][!--quotec--]
If one doesn't ask, one doesn't learn...right?
[/quote]

EXACTLY! that's what this forum is all about ;-).

if you take the overall view of what i showed you above, you'll get the feel for how to limit yourself to a certain number of results to each column. did you notice that it's within a while() statement? you can do the same thing here... observe:
[code]
$authors = mysql_query('SELECT ID, Name FROM Authors') or die(mysql_error());

if (mysql_num_rows($authors) > 0) {
  echo "<table>\n<tr>\n";
  $i = 0;
  $limit = 15;
  while ($author = mysql_fetch_array($authors)) {
    if ($i % $limit == 0)
      echo "<td align='center'>\n";

    $i++;
    $id = $author['ID'];
    $name = htmlspecialchars($author['Name']);
    echo "<a href='editauthor.php?id=$id' class='navbutton'>$name</a>";

    if ($i % $limit == 0)
      echo "</td>\n";
  }
  echo "</tr>\n</table>\n";
}
[/code]

make sure that you change $limit to reflect how many results you want to appear in each column.

otherwise, you should be good to go! hope this makes sense and helps you out some

Share this post


Link to post
Share on other sites
at first glance...

[code]<table>
<tr>

<?php

$perColumn = 75;
$count = 0;
    $authors = mysql_query("SELECT ID, Name from Authors");

    while ($data = mysql_fetch_row($authors)) {
        
        if ( $count == $perColumn ) {
            print "  </td>\n";
            $count = 0;
        }
        
        print '  <td align = "center">\n';    
        print '<a href="index.php?id=$data[0]">$data[1]';

    
        $count++;    
    }

?>
</tr>
</table>[/code]

That should give you what you want.. not tested, but you get the idea, right?

Share this post


Link to post
Share on other sites
[!--quoteo(post=355452:date=Mar 15 2006, 02:53 PM:name=keeB)--][div class=\'quotetop\']QUOTE(keeB @ Mar 15 2006, 02:53 PM) [snapback]355452[/snapback][/div][div class=\'quotemain\'][!--quotec--]
That should give you what you want.. not tested, but you get the idea, right?
[/quote]

the only error i found with your suggestion is that since you're checking $count == $perColumn, you're only going to create a new column after the FIRST 75. you need to use a modulous check to continuously keep your columns duplicating: ($count % $perColumn == 0)... otherwise, looks good

Share this post


Link to post
Share on other sites
This place is the BEST! Thank you folks SO much for the help...it's almost there - I need to play around with it to understand exactly how this is working...

Thanks again!

Share this post


Link to post
Share on other sites
Not a problem bud.. if you have any specific questions regarding the code I posted, don't hesitate ;)

Share this post


Link to post
Share on other sites

×

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.