PHP Vernünftige Tabelle hinbekommen?

raven16

Lieutenant
Registriert
Nov. 2008
Beiträge
580
Hi ich möchte meine Tabelle so aufbauen, dass die nacher so ähnlich aussieht wie die Tabelle in diesem Bild:
wunschtabelle.jpg

Weiß aber echt nicht wie ich die Farben abwechselnd in den Zeilen hinterlegen soll oder wie ich die borders so gut hinbekommen kann wie auf dem Bild...

hoffe ihr könnt mir da ein wenig weiterhelfen...
mein quelltext sieht bisher so aus:

PHP:
if($_GET['page']=='answer')
{
	$sql_get_noanswers = mysql_query("SELECT probtitel,probtype,probdate,probname,probage,probgender
	FROM probleme
	ORDER BY probdate DESC") or die(mysql_error()." ->Abfrage <b>sql_get_noanswers</b> klappt nicht.");
	echo'
	<table style="width:749px;font-size:small;">
		<tr>
			<td>
				<b>Eingangszeit</b>
			</td>
			<td>
				<b>Titel/Überschrift</b>
			</td>
			<td>
				<b>Problemtyp</b>
			</td>
		</tr>
											';												
	while($obj_get_noanswers = mysql_fetch_object($sql_get_noanswers))
	{
		$year = date("d.m.Y", $obj_get_noanswers->probdate);
		$time = date("H:i", $obj_get_noanswers->probdate);
		echo'
		<tr>
			<td>
				'.$year.' - '.$time.' Uhr
			</td>
			<td>
				'.$obj_get_noanswers->probtitel.'
			</td>
			<td>
				'.$obj_get_noanswers->probtype.'
			</td>
		</tr>';
	}
	echo'
	</table>
	';
}
 
Hier ein kleines Beispiel:

PHP:
	$bgcolor = array (0 => 'red', 1 => 'blue');
	
	$echotbl .= '<table border="1">';
	$echotbl .= '<tr><th>Spalte_1</th>';
	$echotbl .= '<th>Spalte_2</th></tr>';
				
	for($i=1; $i<10; $i++)
	{
		$echotbl .= '<tr style="background-color: ' . $bgcolor[$i%2] . ';">';
		$echotbl .= '<td>' . $i . '</td>';
		$echotbl .= '<td>' . "$i" . '</td>';
		$echotbl .= '</tr>' . "\n";
	}
	
	$echotbl .= '</table>';
	
	echo $echotbl;
 
danke ich werd selbst auch noch ein wenig dran basteln^^

weitere vorschläge sind noch gerne erwünscht

ich glaub ich mach das doch mit divs... weil ich es nicht hinbekomme, die borders ordentlich zu machen... selbst wenn ich border: none; mache bleiben zwischen den zellen kleine lücken
 
Zuletzt bearbeitet:
@flugser: ist zwar gut gemeint, aber ich weiß nicht, ob er versteht, warum dein Beispiel funktioniert...

@raven16: Das beste ist, du zählst in der while-Schleife die Zeilennummer mit, die Idee ist dann ganz einfach:
Alle Zeilen mit ungerader bzw. alle Zeilen mit gerader Nummer haben jeweils die selben Hintergrundfarben.
$i % 2 liefert den Rest von $i geteilt durch 2, d.h. entweder 0 oder 1 (entweder gerade oder ungerade also).
Der Ausdruck ist deshalb so elegant, weil man ohne eine Abfrage auskommt, wenn man die Farben schon in einem Array mit entsprechenden Indizies liegen hat.
 
Hier eine Lösung:
PHP:
<?php
if($_GET['page']=='answer')
{
    $sql_get_noanswers = mysql_query("SELECT probtitel,probtype,probdate,probname,probage,probgender
    FROM probleme
    ORDER BY probdate DESC") or die(mysql_error()." ->Abfrage <b>sql_get_noanswers</b> klappt nicht.");
    echo'
    <table style="width:749px;font-size:small;">
        <tr>
            <td>
                <b>Eingangszeit</b>
            </td>
            <td>
                <b>Titel/Überschrift</b>
            </td>
            <td>
                <b>Problemtyp</b>
            </td>
        </tr>
                                            ';
	$i = 0;
    while($obj_get_noanswers = mysql_fetch_object($sql_get_noanswers))
    {
		$i++;
        $year = date("d.m.Y", $obj_get_noanswers->probdate);
        $time = date("H:i", $obj_get_noanswers->probdate);
        echo'
        <tr class="row'.$i.'">
            <td>
                '.$year.' - '.$time.' Uhr
            </td>
            <td>
                '.$obj_get_noanswers->probtitel.'
            </td>
            <td>
                '.$obj_get_noanswers->probtype.'
            </td>
        </tr>';
		if($i == 2) { $i = 0; }
    }
    echo'
    </table>
    ';
}
?>

Jetzt kannst du mit der CSS-Eigenschaft "table tr.row1" und "table tr.row2" alles einstellen (Farben, Größe, Rahmen)...
 
Zuletzt bearbeitet:
% ist doch modulo oder wie das heißt ne?

dann kommt immer Rest = 0 oder 1 raus... und je nachdem ob 0 oder 1 macht der dann den hintergrund^^
 
Das wird aber auch nur bei zwei unterschiedlichen Zeilen klappen, nicht aber wenn du >3 bis n-tlich verschieden Farbige Zeilen willst. Z.B: 1.) dunkelblau, 2.) normales blau, 3.) hellblau, 4.) sehr helles blau, fast weiß. und dann immer wieder in der Reihenfolge wiederholen.
 
@ Eagle-PsyX-: funktioniert auch mit mehr als zwei, dann rechnest du nicht modulo 2 sondern modulo n. in deinem fall n=4, 0 mod 4 = 0, 1 mod 4 = 1, 2 mod 4 = 2, 3 mod 4 = 3, 4 mod 4 = 0, 5 mod 4 = 1....
 
Zuletzt bearbeitet:
Danke... habs mit Eagles Lösung recht leicht realisieren können...

hab aber an statt einer table nun divs genommen weil ich so die borders und so besser machen konnte ;-)

PHP:
$sql_get_noanswers = mysql_query("SELECT probid,probtitel,probtype,probdate,probname,probage,probgender
							FROM probleme
							ORDER BY probdate ASC") or die(mysql_error()." ->Abfrage <b>sql_get_noanswers</b> klappt nicht.");
echo'
<div style="border:2px solid #494949;width:745px;font-size:small;">
	<div style="float:left;width:138px;background:#999999;font-weight:bold;border-top:none;border-bottom:2px solid #494949;border-left:none;border-right:1px solid #494949;padding-left:3px;">
		<label>Eingangsdatum</label>
	</div>
	<div style="float:left;width:212px;background:#999999;font-weight:bold;border-top:none;border-bottom:2px solid #494949;border-left:none;border-right:1px solid #494949;padding-left:3px;">
		<label>Titel</label>
	</div>
	<div style="float:left;width:188px;background:#999999;font-weight:bold;border-top:none;border-bottom:2px solid #494949;border-left:none;border-right:1px solid #494949;padding-left:3px;">
		<label>Von</label>
	</div>
		<div style="float:left;width:161px;background:#999999;font-weight:bold;border-top:none;border-bottom:2px solid #494949;border-left:none;border-right:1px solid #494949;padding-left:3px;">
		<label>Problemtyp</label>
	</div>
	<div style="float:left;width:27px;background:#999999;font-weight:bold;border-top:none;border-bottom:2px solid #494949;border-left:none;border-right:none;padding-left:3px;">
		<label>Edit</label>
	</div>
	<div style="clear:both;"></div>
	<form action="#" method="post">
';
	$i = 0;
	while($obj_get_noanswers = mysql_fetch_object($sql_get_noanswers))
	{
		$i++;
		$year = date("d.m.Y", $obj_get_noanswers->probdate);
		$time = date("H:i", $obj_get_noanswers->probdate); 
		if(strlen($obj_get_noanswers->probtitel)>32)
		{
			$text = substr($obj_get_noanswers->probtitel,0,32);
			$dots = '...';
		}
		else
		{
			$text = $obj_get_noanswers->probtitel;
			$dots = '';
		}
		echo'
		<div class="row'.$i.'" style="float:left;width:138px;height:17px;padding-left:3px;border-right:1px solid #494949;">
			<label>'.$year.' - '.$time.' Uhr</label>
		</div>
		<div class="row'.$i.'" style="float:left;width:212px;height:17px;padding-left:3px;border-right:1px solid #494949;">
			<label>'.$text.$dots.'</label>
		</div>
		<div class="row'.$i.'" style="float:left;width:188px;height:17px;padding-left:3px;border-right:1px solid #494949;">
			<label>'.$obj_get_noanswers->probname.', '.$obj_get_noanswers->probage.$obj_get_noanswers->probgender.'</label>
		</div>
		<div class="row'.$i.'" style="float:left;width:161px;height:17px;padding-left:3px;border-right:1px solid #494949;">
			<label>'.$obj_get_noanswers->probtype.'</label>
		</div>
		<div class="row'.$i.'" style="float:left;width:24px;height:15px;padding-left:6px;padding-top:2px;">
			<input type="checkbox" name="editobject">
		</div>
		<div style="clear:both;"></div>
';
		if($i == 2) {$i = 0;} 
	}
	echo'</form></div><br><br>';
}

Und die css dazu

Code:
div.row1{
	background:#CCCCCC;
}
div.row2{
	background:#BBBBBB;
}
 
Das ist doch alles auch mit CSS designed Tables möglich, schau dir die Beispiele mal an: http://www.smashingmagazine.com/2006/12/29/css-based-tables-modern-solutions/
Ich meine, weil du jetzt auf divs umgestiegen bist. LAyouten ohne Tabellen ist schön und gut, bedeutet jedoch nicht, dass man tabellarische Dinge nun plötzlich nur mit CSS darstellen soll ;)

Beispiel: Dieses Ding hier ist wirklich eine Tabelle!

Ansonsten: wenn du schon CSS auslagerst, warum ist dann immernoch soviel davon in deiner PHP Datei? Wenn du mehreren Selektoren die gleichen Eigenschaften zuweisen möchtest kannst du diese auch gruppieren.
 
Zuletzt bearbeitet:
@carom
Danke für deinen konstruktiven Beitrag -.-
Ich weiß nicht wie der Wissensstand der Leute hier sind, lieber sage ich zu viel als zu wenig. War sogar irgendwie drauf eingestellt die Frage "wie benutzte ich CSS?" zu beantworten ;)

@kressi
Muss zugeben, dass ich mich mit modulo überhaupt nie beschäftigt habe, wollte ihm eher eine alternative (die Variante die ich immer benutzte) zeigen. - Und die hat er auch anscheinend genommen :-D
 
Eagle-PsyX- schrieb:
@carom
Danke für deinen konstruktiven Beitrag -.-
Ich weiß nicht wie der Wissensstand der Leute hier sind, lieber sage ich zu viel als zu wenig. War sogar irgendwie drauf eingestellt die Frage "wie benutzte ich CSS?" zu beantworten ;)

"Ich weiß nicht wie der Wissensstand der Leute hier sind, lieber sage ich zu viel als zu wenig"

Guter Satz, das gilt aber ebenso für meinen Beitrag :)

Mir fiel nur auf dass es bei deinem Vorhaben kein Grund gibt, Tabellen gegen divs zu tauschen, das war alles.
 
Joar kann ja sein das es mit einer Tabelle genauso gut ist... aber bevor ich mich nun stundenlang mit den tabellen rumschlage nehm ich lieber divs und ich hab es damit genauso so hinbekommen wie ich es wollte....

hab aber noch ne andere frage und möchte nicht dafür extra wieder nen thema aufmachen:

und war hat jede Tabellenzeile ne checkbox bekommen
PHP:
<div class="row'.$i.'" style="float:left;width:24px;height:17px;border-right:1px solid #494949;padding-left:6px;">
	<input type="checkbox" name="checkid[]" value="'.$obj_get_noanswers->probid.'" style="margin:0px;">
</div>

Darunter hab ich dann im gleichen Formular ein button hingesetzt:
PHP:
<input type="button" name="checkall" value="Alle an-/abwählen" onClick="checkAll()" style="width:144px;background:#FFFFFF;border:1px solid #494949;cursor:pointer;">

Hab das von ner anderen Seite weil ich vorher nen bisschen selbst gesucht habe danach weil ich überhaupt nicht weiß, wie ich das anstellen soll und nicht soo viel ahnung von javascript habe...jedenfalls das script dazu, welches ich in den <head> reinkopiert habe sieht so aus:

HTML:
<script type="text/javascript" language="JavaScript">
	<!-- Begin
	function checkAll() 
	{
		var no;
		var m=document.listform;
		no=m.elements["checkid[]"].length;
		if(!ismarked) 
		{
			for(i=0;i<no;i++) 
			{
				m.elements["checkid[]"][i].checked='checked';
			}
			ismarked=true;
			alert(m.elements["checkid[]"].length + " Mails markiert");
		}
		else 
		{
			for(i=0;i<no;i++) 
			{
				m.elements["checkid[]"][i].checked='';
			}
			ismarked=false;
			alert(m.elements["checkid[]"].length + " Mails demarkiert");
		}
	}
	//-->
</script>

Wie kann ich Alle Checkboxen am besten gleichzeitig auswählen?
Wenn ich darunter dann mit input alle ausgewählten zeilen abschicke (was dann häufig mehrere sind) stellt sich die frage, wie kann ich das verwerten auf der seite wo mich das formular weiterleitet? Also dort soll jede Zeile der vorherigen tabelle auf einer ganzen seite erscheinen wo dann der gesamte inhalt angezeigt wird... und unten auf dieser seite sollen dann 2 links erscheinen, wo man die nächste oder vorherige zeile anzeigen lassen kann die man vorher ausgewählt hab...

Ich denke wenn ich erst mal das hinbekomme das ich alle zeilen markieren oder die auswahl aufheben kann in der tabelle und weiß wie ich dann nach dem abschicken des formulars auf die einzelnen zeilen zugreifen kann (was glaub ich über die value der checkbox gemacht wird) dann komm ich mit dem rest schon klar^^

hoffe ihr versteht was ich meine und könnt mir noch ein wenig auf die sprünge helfen :)
 
Noch ne Anmerkung, eher Stil-Fragen:
Von Befehlen wie "if($i == 2) { $i = 0; }" halte ich relativ wenig...
Da würde ich klar "if($i >= 2) { $i = 0; }" bevorzugen... Sehen zwar im Grunde gleich aus, aber die Abfrage >= ist einfach weniger scharf formuliert... an dieser Stelle vielleicht nicht so entscheidend, aber vielleicht mal an anderen Stellen ganz sinnvoll...

Und man könnte genauso
$i = $i++ % 2;
machen oben... und noch was... lieber sprechende Variablen nehmen vor allem über größere Bereiche... ist $i nun die Zeilennummer? Wäre die nicht auch interessant zu wissen?

Und wozu brauchst du eigentlich die Variable $dots?
 
Zuletzt bearbeitet:
@1668mib
Wen meinst du eigentlich? Ich bin mir da nicht sicher.

Ich habe beide Varianten mehr als oft genug benutzt. Ich tippe das binnen Sekunde ohne großartig nachzudenken -weshalb den auch. Mir ist sehr wohl der Unterschied zwischen "gleich" und "größergleich" bekannt.
Meinst du das macht wirklich einen Unterschied? In einer geschloßenen Schleife, wo die dafür zuständige variable unabhängig ist- ist das egal.

ist $i nun die Zeilennummer? Wäre die nicht auch interessant zu wissen?
Du meinst doch nicht ernsthaft das $i hier das Problem ist? Nimm halt $DieVarGibtsEhNurHier["100"]["Prozent"]... :D

PHP:
if((5 > 3) OR (3 < 5)) {} # dreh es wie du willst, das Resultat bleibt das selbe, die Leistung ebenfalls.
Oder alternativ:

PHP:
$T = 1;
foreach($vars as $var) {
if ($T > 2) { $T = 1; }
# mach was wie echo $T #
$T++;
}
 
Zuletzt bearbeitet:
Ich habe allgemein Stil-Tipps gegeben, klar ist einem beim Programmieren klar was $i ist, aber schau mal in nem halben Jahr den Code nochmal an, und dir ist dann eben nicht ohne weiteres klar, dass $i nicht die Zeilennummer sondern die Farb-Index-Nummer ist... und es war auch eher ein wenig allgemeiner gemeint.

und was meinst du mit "if((5 > 3) OR (3 < 5)) {}" oO

Und dir ist scheinbar auch nicht klar, warum ich (nicht speziell in diesem Fall, sondern eher auch allgemein) eher mit größer-gleich arbeiten würde... frei nach dem Motto: Misstraue deinen Index-Variablen... sollte aus irgendeinem Grund auch immer $i mal versehentlich zu hoch sein, wird der Wert 2 nun mal nie mehr erreicht...

Ich würde halt z.B. statt $i dann lieber $stilNr oder sowas nehmen...
 
Zuletzt bearbeitet:
Jeder hat so denke ich seinen eigenen Stil wie man es macht,... man kann da stundenlang rumdiskutieren aber die hauptsache ist doch, dass das was man programmiert auch gut läuft... wenn es schlecht läuft kann man sich immer noch gedanken drum machen, ob man nicht vllt. kleine schönheitsfehler ausbessern kann...

und zu dem nicht wissen was $i sein soll kann ich nur sagen das es auch zu not noch die funktion der //Kommentare gibt wo man kurz beschreiben kann was der quelltext macht
 
Zurück
Oben