www.webdeveloper.com
+ Reply to Thread
Results 1 to 6 of 6
  1. 10-01-2008 09:27 AM #1
    Design-is-BS
    Design-is-BS is offline Registered User
    Join Date
    Apr 2008
    Posts
    136

    Exclamation Displaying mysql results in a three column table

    Hey everyone,

    Please no rants on the uselessness of tables.

    I an trying to make an 'automized' system for pricing labels where the user can print off labels, cut them according to the thin borders, etc.

    I have progressed as far as gathering the information form the Database and displaying it the way I want for each tag. View is here.

    Now I want to display the results in a table that is three columns wide, but I'm running into issues with repetition.

    Here is my code:

    PHP Code:
    <?php
        
            //CONNECT TO DB
            include("../DBconnect.php");
        
            //Query Database, setup variables
            $sql = "SELECT * FROM cleaning_supplies ORDER BY description";
        
            $result = mysql_query ($sql, $link);
        while (    $row = mysql_fetch_array($result))  {
                $description = $row['description'];
                $price = $row['price'];
                $code = $row['code'];
                $case = "{$row['case']} /case";
                if (    $case < 1.00)  {
                        $case = null;
                }
                if (    $code == "null")  {
                        $code = null;
                }
                $price_tag = "<div id=\"tags\">\n
                        <table cellspacing=\"0\" cellpadding=\"0\">\n
                            <tr>\n
                                <td id=\"des\" colspan=\"2\">\n
                                        {$description}\n
                                </td>\n
                            </tr>\n
                            <tr>\n
                                <td id=\"descont\">\n
                                        {$case}\n
                                </td>\n
                                <td id=\"price\" rowspan=\"2\">\n
                                    <strong>\$</strong>    {$price}\n
                                </td>\n
                            </tr>\n
                            <tr>\n
                                <td id=\"code\">\n
                                        {$code}\n
                                </td>\n
                            </tr>\n
                        </table>\n
                    </div>\n"    ;

                //Begin Document
                echo "
        
                <!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=UTF-8\" />
                <title>Rotblotts.com Admin - Print Cleaning Supplies List</title>
                <link rel=\"stylesheet\" type=\"text/css\" href=\"../admin/rotblotts_admin.css\">
                </head>
                
                <body>
                <table>
                    <tr>
                        <td>
                                {$price_tag}
                        </td>
                    </tr>
                </table>
                
            "    ;
        }
        
        
        
    ?>
    Brian Senchak
    Graphic Designer
    DesignisBS.ca
    Reply With Quote Reply With Quote
  2. 10-01-2008 09:50 AM #2
    aj_nsc's Avatar
    aj_nsc
    aj_nsc is offline JS/CSS Supernerd
    Join Date
    Dec 2005
    Posts
    2,984
    Why can't we rant on the uselessness of tables? If we do, then you would see that you're got about ten times the amount of code in there that you need. In addition to that, the solution would be simple if you used an unordered list (ul) which is what this looks like anyway, instead of tables.

    Note: you might need to adjust the width of the ul in order to get 3 labels across. I haven't tested it.

    Note #2: I also think that it's ridiculous to use a table to create each individual label, but I didn't feel like re-writing your CSS so I kept the $price_tag as is.

    PHP Code:
    <!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=UTF-8\" />
      <title>Rotblotts.com Admin - Print Cleaning Supplies List</title>
      <link rel=\"stylesheet\" type=\"text/css\" href=\"../admin/rotblotts_admin.css\">
     </head>
     <body>

     <ul style="display: block; width: 1000px; list-style: none;">
    <?php
        
            //CONNECT TO DB
            include("../DBconnect.php");
        


            //Query Database, setup variables
            $sql = "SELECT * FROM cleaning_supplies ORDER BY description";
        
            $result = mysql_query ($sql, $link);
        while (    $row = mysql_fetch_array($result))  {
                $description = $row['description'];
                $price = $row['price'];
                $code = $row['code'];
                $case = "{$row['case']} /case";
                if (    $case < 1.00)  {
                        $case = null;
                }
                if (    $code == "null")  {
                        $code = null;
                }

                $price_tag = "<div id=\"tags\">\n
                        <table cellspacing=\"0\" cellpadding=\"0\">\n
                            <tr>\n
                                <td id=\"des\" colspan=\"2\">\n
                                        {$description}\n
                                </td>\n
                            </tr>\n
                            <tr>\n
                                <td id=\"descont\">\n
                                        {$case}\n
                                </td>\n
                                <td id=\"price\" rowspan=\"2\">\n
                                    <strong>\$</strong>    {$price}\n
                                </td>\n
                            </tr>\n
                            <tr>\n
                                <td id=\"code\">\n
                                        {$code}\n
                                </td>\n
                            </tr>\n
                        </table>\n
                    </div>\n"    ;

    ?>
            <li style="float: left; margin: 5px;"><?php echo $price_tag; ?></li>
    <?php
            }    
    ?> 
      </ul>
     </body>
    </html>
    Last edited by aj_nsc; 10-01-2008 at 09:58 AM.
    I've switched careers...
    I'm NO LONGER a scientist,
    but now a web developer...
    awesome.
    Reply With Quote Reply With Quote
  3. 10-01-2008 10:35 AM #3
    svidgen's Avatar
    svidgen
    svidgen is offline Angry Stickman
    Join Date
    Jan 2007
    Location
    Wisconsin
    Posts
    2,120
    In general, when you're putting data from MySQL and you want to print it an a table, each table-row correlates with an HTML TR:
    PHP Code:
    print "<table>
      <tr>
        <th>col1 header</th>
        <th>col2 header</th>
        <th>col2 header</th>
      </tr>
    "    ;
      while (    $row = mysql_fetch_assoc($query)) {
        print     "<tr>
          <td>    {$row['col1']}</td>
          <td>    {$row['col2']}</td>
          <td>    {$row['col3']}</td>
        </tr>\n"    ;
      }
    print     "</table>\n"; 
    Make sense?

    PS
    Use a table when what you want is a table ... damn kids.
    Jon Wire

    thepointless.com | rounded corner generator

    I agree with Apple. Flash is just terrible.

    Use CODE tags!
    Reply With Quote Reply With Quote
  4. 10-01-2008 10:39 AM #4
    holyhttp's Avatar
    holyhttp
    holyhttp is offline Registered User
    Join Date
    Nov 2006
    Location
    Oakland
    Posts
    494
    <!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=UTF-8\" />
    <title>Rotblotts.com Admin - Print Cleaning Supplies List</title>
    <link rel=\"stylesheet\" type=\"text/css\" href=\"../admin/rotblotts_admin.css\">
    <style type="text/css">
    <!--
    #container{
    width:1000px;
    }
    .tags{
    width:320px;
    height:250px;
    float:left;
    clear:none;
    font-family:verdana, arial, sans-serif;
    font-size:12px;
    line-height:1.2em;
    color:#000000;
    margin:5px;
    padding:0;
    }


    .desc{
    float:left;
    clear:both;
    }

    .descont{
    float:left;
    clear:both;
    }

    .price{
    width:50&#37;;
    float:left;
    clear:left;
    margin:0;
    padding:0
    font-size:14px;
    font-weight:bold;
    }


    .code{
    width:40%
    float:right;
    text-align:right;
    }
    -->
    </style>

    </head>
    <body>

    <div id="container">
    <?php

    //CONNECT TO DB
    include("../DBconnect.php");



    //Query Database, setup variables
    $sql = "SELECT * FROM cleaning_supplies ORDER BY description";

    $result = mysql_query ($sql, $link);
    while ($row = mysql_fetch_array($result)) {
    $description = $row['description'];
    $price = $row['price'];
    $code = $row['code'];
    $case = "{$row['case']} /case";
    if ($case < 1.00) {
    $case = null;
    }
    if ($code == "null") {
    $code = null;
    }

    echo "<div class=\"tags\">
    <p class=\"des\">$description</p>
    <p class=\"descont\">$case</p>
    <p class=\"price\">$price</p>
    <p class=\"code\">$code</p>
    </div>";

    } //end while loop

    ?>

    </div>
    </body>
    </html>
    <br />

    Copy the CSS code above and put it in an external file linked to your web page. You can then adjust the CSS attributes to format the look-and-feel of avrious elements. ( i.e. margin, padding, font-family, font-size, color,....)
    Do you really want to display "null" when code or case have a value null?
    Web Developer SF Bay Area, CA - Hands-on Training Online - Custom Blog Design
    Reply With Quote Reply With Quote
  5. 10-01-2008 10:51 AM #5
    holyhttp's Avatar
    holyhttp
    holyhttp is offline Registered User
    Join Date
    Nov 2006
    Location
    Oakland
    Posts
    494
    If you have to use CSS to get a clean code then do it right by avoiding inline CSS as much as possible and using classes.

    The main container (#container) will box all the tags whereas each tag is delimited by a tag box with class ".tags".
    Inside each "tags" then a floated HTML (p) can be used to contain each chunk fof information (i.e $price, ....).
    The width of ".price" is 50&#37; whereas ".code" is 40% and floated right. Those two boxes can therefore be aligned side by side width a spacing about 10%.
    You can use the "text-align:left", or right to adjust.


    Have fun
    Last edited by holyhttp; 10-01-2008 at 10:54 AM.
    Web Developer SF Bay Area, CA - Hands-on Training Online - Custom Blog Design
    Reply With Quote Reply With Quote
  6. 10-01-2008 10:58 AM #6
    Design-is-BS
    Design-is-BS is offline Registered User
    Join Date
    Apr 2008
    Posts
    136
    Thanks for your reply aj_nsc,

    Worked wonderfully!

    Thanks very much for helping me out. I will be working on making this system more efficient later on, however it's more time constraints right now. (and for some reason I'm quicker with tables). Have a good one.
    Brian Senchak
    Graphic Designer
    DesignisBS.ca
    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

     

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts

Forum Rules

 HTML5 Development Center



Recent Articles