Anzeige
Tutorialbeschreibung

Excel-Tabelle per CSV in Webseite einbinden

Excel-Tabelle per CSV in Webseite einbinden

In diesem Workshop wird eine einfache Preisliste in Form einer Html-Tabelle in einer Seite dargestellt. Die Datenquelle stammt aus Excel.
Zentrale Punkte sind das Exportieren der Excel-Tabelle als CSV-Datei und das Verarbeiten in PHP mittels fgetcsv().


Schritt 1:
In dieser Abbildung haben wir eine Tabelle, wie sie üblicherweise in der Excelanwendung dargestellt wird.

Bilder


Über Datei->speichern unter...

Bilder


öffnet sich das Dialogfenster "speichern unter" :

Bilder


Wichtig ist hier, dass zum Speichern die Einstellung "CSV" im Dateityp-Dropdown ausgewählt wird.

Schritt 2:
Dadurch haben wir nun die Preisliste im CSV-Format vorliegen.
CSV-Dateien sind im Prinzip einfache Textdateien, in denen die Daten nach einem bestimmten Muster untergebracht sind:

Bilder

Jede Zeile enthält einen kompletten Datensatz, (später in einer Tabellenzeile untergebracht) und Semikolons, die die einzelnen Werte voneinander trennen. In der ersten Zeile haben wir hier die Überschriften für den Tabellenkopf.

Schritt 3:
Zusätzlich zu der CSV-Datei benötigen wir noch ein .php-Datei, die im selben Verzeichnis liegt. In meinem Beispiel habe ich die einfach als preisliste.php benannt und schon ein Html-Grundgerüst hineinkopiert:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dth">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="language" content="de" />
<style type="text/css">

</style>
<title>Preisliste</title>
</head>

<body>
<table>
<?

?>
</table>

</body>
</html>


Schritt 4:

Wie man schon sieht, gibt es eine komplette Seite und im body einen öffnenden und schließenden Table-Tag sowie einen Bereich für das eigentliche PHP-Script.

Darin legen wir nun unser Script an:

<?
$datei = "preisliste_exp.csv";
$fp = fopen($datei,"r");
$i = 0;
while ($dsatz = fgetcsv($fp,filesize($datei),";")){
  if ($i == 0){
    echo "  <tr>n    <th class="artbesch">{$dsatz[0]}</th>n    <th class="artnr">{$dsatz[1]}</th>n    <th>{$dsatz[2]}</th>n  </tr>n";
    } else {
    if (is_int($i/2)){
      $tr = "<tr class="alternate">";
    }else{
      $tr = "<tr>";
    }
    echo "  $trn    <td>{$dsatz[0]}</td>n    <td>{$dsatz[1]}</td>n    <td>{$dsatz[2]}</td>n  </tr>n";
    }
  $i ++;
}
fclose($fp);
?> 


Erklärung zum Code: in $datei habe ich den Pfad zu meiner CSV-Datei gespeichert. Um mit fgetcsv() arbeiten zu können, muss ein gültiger Dateizeiger bestehen (im Code durch $fp repräsentiert). fopen($datei,"r") öffnet eine Datei für den Zugriff, durch das "r" wird der Zugriff auf das LESEN der Datei beschränkt.
fgetcsv() liest eine Zeile ($dsatz) aus der im Dateizeiger angegebenen Datei und wandelt sie mithilfe des Trennzeichens in ein Array um (ähnlich wie "explode()") und setzt den Zeiger auf den Anfang der nächsten Zeile.
Als weitere Parameter braucht fgetcsv() die Länge der längsten Zeile in der Datei und das Trennzeichen als "String".
Ich habe die Größe der längsten Zeile der Einfachheit halber mit der Größe der gesamten Datei angegeben (filesize($datei)), damit ist der Wert auf jeden Fall groß genug, auch ohne, dass man vom Inhalt der Datei Kenntnis nehmen muss.
Das Trennzeichen ist, wie oben schon geschrieben, das ";" Semikolon.
Als Nächstes habe ich eine Zählvariable $i mit dem Wert 0 initialisiert, die später bei jedem Schleifen-Durchlauf um 1 hochgezählt wird. In der while-Schleife wird nun eine Zeile ausgelesen und per echo als Tabellenzeile ausgegeben. Die Zählvariable $i nutzt das Script dafür, die Zellen der ersten Zeile ($i==0) als Tableheadings(), alle weiteren als tabledatacells() auszugeben und die geraden Werte mit einer Klasse (class="alternate") zu belegen.
So lässt sich die Tabelle anschließend einfach per css formatieren.

Und so sieht es im Browser (einschließlich der Formatierungen) aus:
Bilder


Alle Dateien des Workshops in csv.zip


Kommentare
Achtung: Du kannst den Inhalt erst nach dem Login kommentieren.
Portrait von Tobomoster
  • 24.01.2011 - 21:40

gesucht, gefunden, funktioniert! Danke :)

Portrait von testuserxc
  • 15.11.2010 - 21:51

Sehr gute Erklärung! Vielen Dank

Portrait von prowebber
  • 14.08.2010 - 01:01

Sehr verständliches Tut, dass auch so funktioniert!

Portrait von solutionphil
  • 09.03.2010 - 08:42

sehr gut !!! genau das habe ich gesucht

Alternative Portrait
-versteckt-(Autor hat Seite verlassen)
  • 17.02.2010 - 09:04

sehr gut!
wirklich empfehlenswert!

Portrait von Dissel2010
  • 07.02.2010 - 20:42

Danke für das einfach Tut, hilft mir viel weiter!!!

Alternative Portrait
-versteckt-(Autor hat Seite verlassen)
  • 02.02.2010 - 12:39

Danke-das war sehr hilfreich. Weiter so.

Portrait von idl_cs
  • 20.01.2010 - 12:46

Ein gut geschriebenes und verständlich erklärtes Tutorial. Es erleichtert das Einbinden von Tabellen besonders dann, wenn diese auf Internetseiten lediglich angezeigt werden sollen.

Portrait von Youdiddesign
  • 04.11.2009 - 09:52

Gutes Tutorial!
Erleichtert einem die Arbeit, da man nicht mehr alle Daten per Hand einbinden muss oder erste eine SQL Datenbank anlegen muss.

Portrait von jorsa
  • 20.10.2009 - 11:29

Sehr gut erklärt, ich hoffe es ist so einfach wie es sich liest.

Portrait von Designerist
  • 18.10.2009 - 12:40

Vielen Dank, sokie, habe ich schon lange gewollt, das kann man immer gut gebrauchen.
Grüsse, Designerist

Portrait von dy_raffy
  • 17.10.2009 - 11:47

Das war echt nett, danke schön.

Portrait von zimmermann
  • 16.10.2009 - 22:09

Grundsätzlich gut, allerdings würde ich die $datei per include auslagern und noch ein wenig auf die sicherheit achten.

Portrait von KampfGnom6491
  • 16.10.2009 - 14:46

Sau gut sowas habe ich schon mal vor einiger zeit gesucht

Portrait von thomsenB
  • 16.10.2009 - 11:32

Alternativ gibt es für PHP auch einen Excel-Reader der die Original-Dateien lesen kann: http://phpexcelreader.sourceforge.net/

Dies spart ggf. die Umwandlung in CSV...

x
×
×