laxi Posted January 12, 2014 Share Posted January 12, 2014 Hello people, I need to get the items displayed dynamically from Mysql database in a 5x3 grid on my webpage. I have managed to put together a dynamic table from Mysql DB. However, I am not able to display the items in a grid format. The output is diplayed linearly on the webpage. Can someone tell me what I need to correct on my script to get them displayed as a grid instead of the linear display. FYI, $dynamicList is a table that puts together product details and $dyn_table is the grid table. <?php// Connect to the MySQL databaseinclude "storescripts/connect_to_mysql.php";// This block grabs the whole list for viewing$i=0;$sql = mysql_query("SELECT * FROM products ORDER BY date_added DESC");$productCount = mysql_num_rows($sql); // count the output amountif ($productCount > 0) {$dyn_table = '<table border="0" cellpadding="4">';while($row = mysql_fetch_array($sql)){$id=$row["id"];$product_name=$row["product_name"];$price=$row["price"];$category=$row["category"];$first_subcategory=$row["first_subcategory"];$second_subcategory=$row["second_subcategory"];$date_added=$row["date_added"];$dynamicList .= ' <table width="20%" border="1" cellspacing="0" cellpadding="4"><tr><td><a href="product.php?id='.$id.'"><img src="inventory_images/'.$id.'.jpg" width="243" border="1" height="240" alt="$dynamicTitle" /></a></td></tr><tr><td> ' .$product_name . '</br><hr>$ ' .$price . '</br><hr><a href="product.php?id='.$id.'">View Product Details</a></td></tr></table>';if ($i % 3==0){$dyn_table .='<tr><td>' . $dynamicList .'</td>';}else{$dyn_table .='<td>' . $dynamicList .'</td>';}$i++;}$dyn_table .='</tr></table>';} else {$dynamicList = "We have no products listed in our store yet";}mysql_close();?> Thank you in advance Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/ Share on other sites More sharing options...
ginerjm Posted January 12, 2014 Share Posted January 12, 2014 You never close your row tag in your if where you check how many cols you have posted. if ($i % 3==0) { $dyn_table .="<tr><td>$dynamicList</td>"; } else { $dyn_table .= "<td>$dynamicList</td>"; } You should be issuing a </tr> tag at some point, but you will need to figure out how to avoid the first row starting with one. Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1464979 Share on other sites More sharing options...
laxi Posted January 13, 2014 Author Share Posted January 13, 2014 No luck yet...can somebody help me figure this out? Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465008 Share on other sites More sharing options...
ginerjm Posted January 13, 2014 Share Posted January 13, 2014 Works for me - I added the </tr> tag at the appropriate place. Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465011 Share on other sites More sharing options...
rbrown Posted January 13, 2014 Share Posted January 13, 2014 It is like ginerjm explained... you aren't closing your table rows. Look at the html source after you run the script. Plus I would use a count instead. Your: if ($i % 3==0) should be if ($i % 3 === 0) and only used if you are trying to get 3 columns then a new row, which I don't think you want, since you have a table within a table. Try this: $Count = 0; //set outside while loop if ($productCount != $Count) { $dyn_table .=" <tr> <td> $dynamicList </td> </tr>"; } else { $dyn_table .= " <tr> <td> $dynamicList </td>"; } Plus you should get into the habit of indenting your code (makes it easier to read. And more likely for people to help... This is a mess. Go get Netbeans or an Ide.) and start using mysqli instead of mysql. Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465013 Share on other sites More sharing options...
ginerjm Posted January 13, 2014 Share Posted January 13, 2014 (edited) Make this change: if ($i % 3 == 0) { if ($i <> 0) $dyn_table .= "</tr>"; $dyn_table .= "<tr><td>$dynamicList</td>"; } else { $dyn_table .= "<td>$dynamicList</td>"; } $i++; Edited January 13, 2014 by ginerjm Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465014 Share on other sites More sharing options...
jcbones Posted January 13, 2014 Share Posted January 13, 2014 (edited) I changed the things that stood out to me. This code is un-tested though, so I'm sure I could have missed something. <?php // Connect to the MySQL database include "storescripts/connect_to_mysql.php"; // This block grabs the whole list for viewing $i=0; $firstRun = true; //holding. $sql = mysql_query("SELECT * FROM products ORDER BY date_added DESC"); $productCount = mysql_num_rows($sql); // count the output amount if ($productCount > 0) { $dyn_table = '<table border="0" cellpadding="4"><tr>'; //added <tr> to start the first row. while($row = mysql_fetch_array($sql)){ $id=$row["id"]; $product_name=$row["product_name"]; $price=$row["price"]; $category=$row["category"]; $first_subcategory=$row["first_subcategory"]; $second_subcategory=$row["second_subcategory"]; $date_added=$row["date_added"]; //remove the appending . from $dynamicList, because I'm sure you don't want 15 tables on the last table cell. $dynamicList = ' <table width="20%" border="1" cellspacing="0" cellpadding="4"> <tr colspan="3"> <td><a href="product.php?id='.$id.'"><img src="inventory_images/'.$id.'.jpg" width="243" border="1" height="240" alt="$dynamicTitle" /></a></td> </tr> <tr> <td> ' .$product_name . '</br> <hr> $ ' .$price . '</br> <hr> <a href="product.php?id='.$id.'">View Product Details</a></td> </tr> </table>'; if ($i++ % 3==0 && $firstRun == false){ //increment $i before EDIT: AFTER using, so on the first run 1 / 3 != 0; $dyn_table .='</tr><tr>'; //added a closing </tr> so that the row will end on the 3rd run. } //took out else statement, as there is no need to type things twice. $dyn_table .='<td>' . $dynamicList .'</td>'; $firstRun = false; //changed firstrun to false, so that the increment will work correctly. } $dyn_table .= '</tr></table>'; } else { $dynamicList = "We have no products listed in our store yet"; } mysql_close(); ?> Edited January 13, 2014 by jcbones Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465016 Share on other sites More sharing options...
laxi Posted January 13, 2014 Author Share Posted January 13, 2014 Hi, I tried this code but now it displays only 1 product, ie 1 row and 1 coloumn.No other products are displayed. I changed the things that stood out to me. This code is un-tested though, so I'm sure I could have missed something. <?php // Connect to the MySQL database include "storescripts/connect_to_mysql.php"; // This block grabs the whole list for viewing $i=0; $firstRun = true; //holding. $sql = mysql_query("SELECT * FROM products ORDER BY date_added DESC"); $productCount = mysql_num_rows($sql); // count the output amount if ($productCount > 0) { $dyn_table = '<table border="0" cellpadding="4"><tr>'; //added <tr> to start the first row. while($row = mysql_fetch_array($sql)){ $id=$row["id"]; $product_name=$row["product_name"]; $price=$row["price"]; $category=$row["category"]; $first_subcategory=$row["first_subcategory"]; $second_subcategory=$row["second_subcategory"]; $date_added=$row["date_added"]; //remove the appending . from $dynamicList, because I'm sure you don't want 15 tables on the last table cell. $dynamicList = ' <table width="20%" border="1" cellspacing="0" cellpadding="4"> <tr colspan="3"> <td><a href="product.php?id='.$id.'"><img src="inventory_images/'.$id.'.jpg" width="243" border="1" height="240" alt="$dynamicTitle" /></a></td> </tr> <tr> <td> ' .$product_name . '</br> <hr> $ ' .$price . '</br> <hr> <a href="product.php?id='.$id.'">View Product Details</a></td> </tr> </table>'; if ($i++ % 3==0 && $firstRun == false){ //increment $i before EDIT: AFTER using, so on the first run 1 / 3 != 0; $dyn_table .='</tr><tr>'; //added a closing </tr> so that the row will end on the 3rd run. } //took out else statement, as there is no need to type things twice. $dyn_table .='<td>' . $dynamicList .'</td>'; $firstRun = false; //changed firstrun to false, so that the increment will work correctly. } $dyn_table .= '</tr></table>'; } else { $dynamicList = "We have no products listed in our store yet"; } mysql_close(); ?> Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465019 Share on other sites More sharing options...
ginerjm Posted January 13, 2014 Share Posted January 13, 2014 I gave you the fix to make - two lines, that's all and it works just fine. And I showed you where to place them. What else can I do? Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465020 Share on other sites More sharing options...
laxi Posted January 13, 2014 Author Share Posted January 13, 2014 I made changes you sugested but it still gives me a linear display.Not sure why.. I gave you the fix to make - two lines, that's all and it works just fine. And I showed you where to place them. What else can I do? Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465021 Share on other sites More sharing options...
laxi Posted January 13, 2014 Author Share Posted January 13, 2014 Hi ginerjm Please find my script below. It still displays linear.. <?php// Connect to the MySQL databaseinclude "storescripts/connect_to_mysql.php";// This block grabs the whole list for viewing$i=0;$sql = mysql_query("SELECT * FROM products ORDER BY date_added DESC");$productCount = mysql_num_rows($sql); // count the output amountif ($productCount > 0) {$dyn_table = '<table border="0" cellpadding="4">';while($row = mysql_fetch_array($sql)){$id=$row["id"];$product_name=$row["product_name"];$price=$row["price"];$category=$row["category"];$first_subcategory=$row["first_subcategory"];$second_subcategory=$row["second_subcategory"];$date_added=$row["date_added"];$dynamicList .= ' <table width="20%" border="1" cellspacing="0" cellpadding="4"><tr><td><a href="product.php?id='.$id.'"><img src="inventory_images/'.$id.'.jpg" width="243" border="1" height="240" alt="$dynamicTitle" /></a></td></tr><tr><td> ' .$product_name . '</br><hr>$ ' .$price . '</br><hr><a href="product.php?id='.$id.'">View Product Details</a></td></tr></table>';if ($i % 3==0){if ($i <> 0)$dyn_table .= "</tr>";$dyn_table .= "<tr><td>$dynamicList</td>";}else{$dyn_table .= "<td>$dynamicList</td>";}$i++;}$dyn_table .='</tr></table>';} else {$dynamicList = "We have no products listed in our store yet";}mysql_close();?> Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465023 Share on other sites More sharing options...
ginerjm Posted January 13, 2014 Share Posted January 13, 2014 (edited) Actually looking at this code I don't see what is wrong with it, but as someone else pointed out it Is extremely hard to read as you've written it. Personally I detest code that uses more than one set of <? ?> tags, so reading yours is definitely not easy for me. (look up 'heredocs' in the php manual) Edited January 13, 2014 by ginerjm Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465025 Share on other sites More sharing options...
laxi Posted January 13, 2014 Author Share Posted January 13, 2014 Hi, I tried the below, still no luck.below is the code used <?php// Connect to the MySQL databaseinclude "storescripts/connect_to_mysql.php";// This block grabs the whole list for viewing$i=0;$sql = mysql_query("SELECT * FROM products ORDER BY date_added DESC");$productCount = mysql_num_rows($sql); // count the output amountif ($productCount > 0) {$dyn_table = '<table border="0" cellpadding="4">';while($row = mysql_fetch_array($sql)){$id=$row["id"];$product_name=$row["product_name"];$price=$row["price"];$category=$row["category"];$first_subcategory=$row["first_subcategory"];$second_subcategory=$row["second_subcategory"];$date_added=$row["date_added"];$dynamicList .= ' <table width="20%" border="1" cellspacing="0" cellpadding="4"><tr><td><a href="product.php?id='.$id.'"><img src="inventory_images/'.$id.'.jpg" width="243" border="1" height="240" alt="$dynamicTitle" /></a></td></tr><tr><td> ' .$product_name . '</br><hr>$ ' .$price . '</br><hr><a href="product.php?id='.$id.'">View Product Details</a></td></tr></table>';if ($i % 3==0){if ($i <> 0){$dyn_table .= "</tr>";$dyn_table .= "<tr><td>$dynamicList</td>";}else{$dyn_table .= "<td>$dynamicList</td>";}}$i++;}$dyn_table .='</tr></table>';} else {$dynamicList = "We have no products listed in our store yet";}mysql_close();?> Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465027 Share on other sites More sharing options...
ginerjm Posted January 13, 2014 Share Posted January 13, 2014 my bad - you saw my original response before I re-read and saw the brace you had. This is now bad: if ($i % 3==0){if ($i <> 0){$dyn_table .= "</tr>";$dyn_table .= "<tr><td>$dynamicList</td>";}else{$dyn_table .= "<td>$dynamicList</td>";}}$i++;} Try this: if ($i % 3==0) { if ($i <> 0) $dyn_table .= "</tr>"; $dyn_table .= "<tr><td>$dynamicList</td>";}else{ $dyn_table .= "<td>$dynamicList</td>";}$i++; Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465028 Share on other sites More sharing options...
dungpt29 Posted January 13, 2014 Share Posted January 13, 2014 (edited) Hello people, I need to get the items displayed dynamically from Mysql database in a 5x3 grid on my webpage. I have managed to put together a dynamic table from Mysql DB. However, I am not able to display the items in a grid format. The output is diplayed linearly on the webpage. Can someone tell me what I need to correct on my script to get them displayed as a grid instead of the linear display. FYI, $dynamicList is a table that puts together product details and $dyn_table is the grid table. I have read carefully your PHP script. In my opinion, the solution used in the script is too bad and it cannot help you display product data as desired. Therefore, you are to develop a new one. Currently, I am not sure what exactly your structure of the grid is. Can you describe it more detailedly using a drawing? How many columns does it have? What is name of each column if existed? If so, I will be ready to help you work out another solution to display the product list on your webpage. Edited January 13, 2014 by dungpt29 Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465054 Share on other sites More sharing options...
mac_gyver Posted January 13, 2014 Share Posted January 13, 2014 (edited) your code is concatenating the $dynamicList variable every pass through the loop, resulting in a mess in the html - $dynamicList . = i would also re-factor the code so as to not repeat (DRY) - if ($i % 3==0) { if ($i <> 0) { // end the previous row, when not the first one $dyn_table .= "</tr>"; } // start a new row $dyn_table .= "<tr>"; } // the data section in each row $dyn_table .= "<td>$dynamicList</td>"; $i++; Edited January 13, 2014 by mac_gyver Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465057 Share on other sites More sharing options...
cyberRobot Posted January 13, 2014 Share Posted January 13, 2014 (edited) I personally would store all the tables in an array and then use array_chunk() to break them into groups of three. For example, you could try something like the following: <?php // Connect to the MySQL database include "storescripts/connect_to_mysql.php"; // This block grabs the whole list for viewing //INITIALIZE VARIABLES $tableArray = array(); //LOOP THROUGH PRODUCT INFORMATION $sql = mysql_query("SELECT * FROM products ORDER BY date_added DESC"); while($row = mysql_fetch_array($sql)) { $tableArray[] = '<table width="20%" border="1" cellspacing="0" cellpadding="4"> <tr> <td><a href="product.php?id='.$row['id'].'"><img src="inventory_images/'.$row['id'].'.jpg" width="243" border="1" height="240" alt="$dynamicTitle" /></a></td> </tr> <tr> <td> ' .$row['product_name'] . '</br> <hr> $ ' .$row['price'] . '</br> <hr> <a href="product.php?id='.$row['id'].'">View Product Details</a></td> </tr> </table>'; } mysql_close(); //IF PRODUCTS WERE FOUND, DISPLAY THEM if(!empty($tableArray)) { $tableArray = array_chunk($tableArray, 3); foreach($tableArray as $tableGroup) { echo '<table border="0" cellpadding="4">'; echo '<tr>'; foreach($tableGroup as $currTable) { echo "<td>$currTable</td>"; } echo '</tr>'; echo '</table>'; } //ELSE...NO PRODUCTS } else { echo 'We have no products listed in our store yet'; } ?> Note that I got rid of some extra variables. Instead of using $id, for example, I just used the $row['id'] variable. It requires fewer lines of code and requires less overhead since PHP doesn't need to maintain duplicate variables. Edited January 13, 2014 by cyberRobot Quote Link to comment https://forums.phpfreaks.com/topic/285312-unable-to-display-a-table-in-a-grid-format/#findComment-1465058 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.