2013-03-10 2 views
0

ОбзорPHP эхо таблицы

У меня есть некоторые данные, хранящиеся в базе данных MySql, связанных с продуктами. Я пытаюсь получить эти данные и отобразить их на странице с помощью таблицы HTML. PHP и MySql прошли хорошо, и все данные извлекаются, но отображаются очень грязно.

Вот что я имею в макете:

enter image description here

Что я стремлюсь добиться того, чтобы в дальнейшем разделить таблица результатов добавить больше столбцов строки, чтобы сделать данные более читаемыми

Something как это;

enter image description here

Код: PHP, MySQL & HTML:

<?php 

    session_start(); 

    include('connect_mysql.php'); 


    $product_name = 'product_name'; 
    $product_qua = 'product_qua'; 
    $product_price = 'product_price'; 
    $product_image = 'product_image'; 
    $product_des = 'product_des'; 


$sql = mysql_query("SELECT * FROM products"); 

echo "<table id='display'>"; 


while($rows = mysql_fetch_array($sql)) 
{ 
    echo"<br>"; 
    echo"<tr><td>"; 
    echo"$rows[$product_name]<br></td>"; 

    echo"<td><img src=$rows[$product_image] height='200px' width='200px'><br></td>"; 
    echo"<td>Avalible: $rows[$product_qua]<br></td>"; 
    echo"<td>Price: $rows[$product_price]<br></td>"; 
    echo"<td>Description: $rows[$product_des]<br></td>";  
    echo"</tr>"; 

} 

echo "</table>"; 
?> 

CSS ответственность за эту часть:

#display{ 
    float:left; 
    border: 5px solid black; 
    margin-left:100px; 


} 
+0

Вам нужно добавить границы и, возможно, также дополнять ваши tds [edit: что сказал krike в своем ответе]. Кроме того, у вас есть «
». – Theraot

ответ

5

Прежде всего не эхо столько HTML с помощью PHP , вместо этого сделайте это следующим образом

<?php 
    session_start(); 

    include('connect_mysql.php'); 

    $product_name = 'product_name'; 
    $product_qua = 'product_qua'; 
    $product_price = 'product_price'; 
    $product_image = 'product_image'; 
    $product_des = 'product_des'; 


$sql = mysql_query("SELECT * FROM products"); ?> 

<table id='display'> 
    <?php 
     while($rows = mysql_fetch_array($sql)) { 
    ?> 
     <tr><td><?php echo $rows[$product_name]; ?></td> 
     <!-- And so on--> 
    <?php 
     } 
    ?> 
</table> 

Во-вторых, видя ваше inmage, похоже, вам нужно границу для таблицы, так что используйте

table, td { 
    border: 1px solid #000000; 
} 
+0

ok thx для вашего совета применил вашу предложенную технику, и, похоже, это работает, но мой вопрос заключается в том, как это выгодно моему коду: P надеюсь, что это не хромой вопрос hehe – Tomazi

+0

Я бы сказал, что он делает ваш код более легким для чтения на приличном тексте редактор. Вы также можете писать еще меньше, упрощая до

1

добавить следующий CSS, чтобы применить границу на своих ячейках таблицы:

#display td{ border: 2px solid red; } 

и при необходимости добавлять к вашему #display {:

border-collapse: collapse; 
6

просто добавить отступы или рамку для ячеек таблицы:

table#display td{ 
    border: 1px solid black; 
    padding:0 8px; 

} 

Edit: Что вы могли бы сделать так:

<table id='display'> 
<?php while($rows = mysql_fetch_array($sql)): ?> 
    <!-- <br> <- why a break? it's not in the correct spot anyway --> 
<tr><td> 
<?php echo $rows[$product_name]; ?><br> 
</td> 
<td> - </td> 
<td><img src="<?php echo $rows[$product_image]; ?>" height='200px' width='200px'><br></td> 
<td> - </td> 
<td>Avalible: <?php echo $rows[$product_qua]; ?><br></td> 
<td> - </td>  
<td>Price: <?php echo $rows[$product_price]; ?><br></td> 
<td> - </td> 
<td>Description: <?php echo $rows[$product_des]; ?><br></td> 
</tr> 
<?php endwhile; ?> 
</table> 

Совет: Я предпочитаю использовать это время/ENDWHILE; а не использовать скобки при отображении данных пользователю.

+0

ok Ур ответ, кажется, решает мой вопрос спасибо v.much – Tomazi

+0

один последний быстрый вопрос ... скажите, что я хочу разделить каждый предмет вместе не только на «линию», как это может быть достигнуто – Tomazi

+0

Они уже разделены. каждый элемент находится в его собственной ячейке. Единственное разделение теперь визуально. Через строку или вы можете добавить td между вашими данными и добавить разделительный символ. (обновит мой ответ) – Christophe