Mysql data to a styled HTML Table

匿名 (未验证) 提交于 2019-12-03 09:02:45

问题:

I need some Help. I'm new to PHP and the last couple of days trying to solve this issue. I am trying to parse data from my database to a styled HTML Table and I am not able to find any tutorials on this. I did do the tutorial for parsing to a table that is created with PHP. I would like to use the tables I did include in this file. If anyone would be so kind to show me how to do this and also explain it I would be very happy.

This is the PHP file I did try to work with. Only one close I could find from tutorials.

This is the stylesheet I would like to use:

/* ------------------    styling for the tables     ------------------   */  body {     line-height: 1.6em; }  #hor-zebra {     font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;     font-size: 12px;     margin: 60px;     width: 480px;     text-align: left;     border-collapse: collapse; } #hor-zebra th {     font-size: 14px;     font-weight: normal;     padding: 10px 8px;     color: #039; } #hor-zebra td {     padding: 8px;     color: #669; } #hor-zebra .odd {     background: #e8edff;  

And this is the HTML file where I would like the data from my database to show:

<!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>DataTable Output</title> <style type="text/css"> <!-- @import url("style.css"); --> </style> </head> <body> <?php include("datamodtagelse.php"); ?> <table id="hor-zebra" summary="Datapass">     <thead>         <tr>             <th scope="col">name</th> //Name off table in DB             <th scope="col">age</th> //Name off table in DB             <th scope="col">issue</th> //Name off table in DB             <th scope="col">Description</th> //Name off table in DB             <th scope="col">quality</th> //Name off table in DB         </tr>     </thead>     <tbody>         <tr class="odd">             <td>1</td>             <td>2</td>             <td>3</td>             <td>4</td>             <td>5</td>         </tr>         <tr>             <td>1</td>             <td>2</td>             <td>3</td>             <td>4</td>             <td>5</td>         </tr>         <tr class="odd">             <td>1</td>             <td>2</td>             <td>3</td>             <td>4</td>             <td>5</td>         </tr>         <tr>             <td>1</td>             <td>2</td>             <td>3</td>             <td>4</td>             <td>5</td>         </tr>         <tr class="odd">             <td>1</td>             <td>2</td>             <td>3</td>             <td>4</td>             <td>5</td>         </tr>     </tbody> </table>  </body> </html> 

After adding the code my PHP do return the result. The only problem is it it not showing my styled tables from my style.css and I also get the error "

Notice: Undefined variable: i in C:\Program Files (x86)\EasyPHP-5.3.9\www\Tables\Datamodtagelse.php on line 25

And under that it returns my output: (This is the php page.)

name                    age issue   Description                           quality Anders And & Co.    1949    1   Dette er en beskrivelse af en tegneserie. Very Fine. 

When I open my html file it doesn't display anything at all.

I will add my file :

Datamodtagelse.php

Showcomic.html:

<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>DataTable Output</title> <style type="text/css"> <!-- @import url("style.css"); --> </style> </head> <body> <?php include("datamodtagelse.php"); ?> </body> </html> 

Style.css

body {     line-height: 1.6em; }  #hor-zebra {     font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;     font-size: 12px;     margin: 60px;     width: 480px;     text-align: left;     border-collapse: collapse; } #hor-zebra th {     font-size: 14px;     font-weight: normal;     padding: 10px 8px;     color: #039; } #hor-zebra td {     padding: 8px;     color: #669; } #hor-zebra .odd {     background: #e8edff;  } 


name varchar(255) utf8_danish_ci
age int(11)
issue int(11)
Description text utf8_danish_ci

When looking at the code I think the problem is the HTML file nor importing the stylesheet and the data from the .php file?

The .php file and the .css file and the .html file is located in the same folder.

Any help is welcome. And sorry this is probably just a easy beginner mistake. (We all need to start somewhere.)

回答1:

Try something like this:

And in your HTML file:

    <!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>DataTable Output</title> <style type="text/css"> <!-- @import url("style.css"); --> </style> </head> <body> <?php include("datamodtagelse.php"); ?> </body> </html> 


回答2:

you are almost there (if the code you showed us runs). in your php file, you need to give your table the id "hor-zebra", so that the style will be applied to it and the th's and td's within it.

you also want to add a counter to get the .odd thing right:

var $i = 0; while($row = mysql_fetch_array( $result )) {     // Print out the contents of each row into a table     echo "<tr";     if( $i++ % 2 == 0 ) echo(" class='odd'");     echo "><td>";      ... 

you also might want to set the scope="col" in your th's to match the original table as closely as possible

AND last but not least: Don't forget the elements thead and tbody in your echo-output.

if you do all this, you should see the same table twice in your final html (check the source, ctrl+U)



回答3:

Remember you can echo your data in div tags too, use

    <li></li>  

to allow row after row of sql data to get displayed. I mention this because I find the div elements easier to work with than tables.



标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!