fixxer Tabellenkopf, scrollbarer Inhalt

SatansEier · 18. September 2006

hi,

ich überleg grad wie ich die kopfzeile (spaltennamen) einer tabelle immer am oberen bildschirmrand behalte, im tabelleninhalt aber beliebig nach oben und unten scrollen kann. für beides hab ich ne eigene funktion die ich in frames setzen könnte, aber vllt gibt`s ja noch ne schönere lösung?

---------------------

Name | Vorname | Ort

---------------------

Wurst| Hans | town >

zeiss | Carl | city > <-- scrollbar

kuhn | peter | stadt >

Manitu71 · 18. September 2006

entweder habe ich dein Problem nicht richtig verstanden, aber das die Tabelle ganz oben ist, kannst du doch leicht über CSS lösen.

SatansEier · 18. September 2006

wenn ich bei tausenden einträgen runterscrolle verschwindet logischerweise der kopf mit den spaltennamen und genau das soll nicht passieren.

Amstelchen · 18. September 2006

ich bezweifle, ob es von der performance und übersichtlichkeit sinn macht, tausende datensätze zu laden und anzuzeigen.

wie wärs, wenn du die zeilen zum seitenweise in, sagen wir mal, 25er schritten durchblättern machst?

s'Amstel

Manitu71 · 18. September 2006

wenn ich bei tausenden einträgen runterscrolle verschwindet logischerweise der kopf mit den spaltennamen und genau das soll nicht passieren.

dann hatte ich dich wohl wirklich falsch verstanden

Du meinst quasi so eine Funktion wie in Excel.

SatansEier · 18. September 2006

s'Amstel, ne blätterfunktion hab ich schon, die tabelle ist die alternativansicht dazu *gg*:marine

derJan · 18. September 2006

funktioniert im IE, leider nicht im FF; dafür kann FF aber div-Container mit position: fixed richtig darstellen

Beispiel-Code (net schön, net sauber, funktioniert aber, eben kurz runtergeschrieben)

seite.html


<html >

<head>

    <title>Tabellenlayout TEST</title>

    <link rel="stylesheet" type="text/css" href="style.css" />

</head>


<body>


<table cellpadding="0" cellspacing="0">

    <tr>

        <td id="top" colspan="2"> 

	Überschrift

        </td>

    </tr>

    <tr>

        <td id="left">

            Menü<br />

        </td>

        <td>

            <div id="content">

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />

		foobar<br />


            </div>

        </td>


    </tr>

</table>


</body>

</html>

style.css


*

{

	font-family: Tahoma, Verdana, Arial;

	color: #ffffff;

	font-size: 10pt;

	text-decoration: none;

}


body 

{

	margin: 0px;

	overflow: hidden;

}


#top

{

	background-color: #232323;

	background-image: url("../Images/logo_top.jpg");

	height: 79px;

	overflow: hidden;

	font-size: 20px;

	font-decoration: bold;

	text-align: center;

}


#left

{

	background-color: #232323;

	width: 100px;

	vertical-align: top;

}



#content

{

	color: #424242;

	text-align: center;

	overflow: auto;

	position: static;

	height: 100%;

	width: 100%;

	padding: 20px;

}


table

{

	width: 100%;

	height: 100%;

}

SatansEier · 19. September 2006

cool danke jan.

http://www.homepage-total.de/css/scrollende-tabelle.php

ich hab grad nur schwierigkeiten das umzusetzen.



echo "<table ......>";


$tabellenkopf="<tr>";

for($i=0;$i<=25;$i++)

{

  $tabellenkopf.= "<td>Feldname</td>";

}

$tabellenkopf.="</tr>";


for($i=0;$i<mysql_num_rows($result);$i++)

{

  $tabelleninhalt.="<tr><td>Datensatz</td></tr>";

}


echo "<pre style='margin: 0px;'>";

  echo $tabellenkopf;

echo "</pre>";


echo "<div style='height: 150px; overflow: auto;'>";

  echo $tabelleninhalt;

echo "</div>";


echo "</table>";

[/PHP]

cool wär wenn ich die beiden arrays (?) in die zwei "container" packen könnte ohne viel umzuschreiben. ungefähr so wie oben versucht.

*I C Q* · 19. September 2006

Alternativ, nur der Vollständigkeit halber genannt, geht auch das hier!

Funktioniert gut, ist allerdings nicht wirklich trafficsparend und performanceoptimiert!

ICQ

SatansEier · 19. September 2006

moep ist ja klar warum das bei mir nicht funktionieren kann ^^

im beispiel gibt es zwei tabellen die unabhängig von einander sind. bei mir schreib ich alles in eine, um für jeder spalte die richtige breite zu haben (feldname <-> spalteninhalt).

SatansEier · 20. September 2006

warum kann es nicht so einfach sein jan?



   echo "<table cellpadding='0' cellspacing='0'>";

    echo "<tr>";

      echo "<td id='top'>";

        echo $tabellenkopf; 

      echo "</td>";

    echo "</tr>";


    echo "<tr>";

      echo "<td>";

        echo "<div id='content'>";

          echo $tabelleninhalt;

        echo "</div>";  

      echo "</td>";

    echo "</tr>";  

  echo "</table>";

[/PHP]

derJan · 20. September 2006

was genau funktioniert denn nicht, der Ansatz ist schon in Ordnung so,

allerdings müsstest du für die Daten in der Tabelle zwei geschachtelte Schleifen verwenden, weil du ja Spalten und Zeilen füllen musst.

also etwa so:


echo "<table border='1'>";


$tabellenkopf="<tr>";

for($i=0;$i<=3;$i++)

{

  $tabellenkopf.= "<th>Feldname $i</th>";

}

$tabellenkopf.="</tr>";


for($i=0;$i<=3;$i++)

{

	$tabelleninhalt .= "<tr>";

	for($j=0;$j<=3;$j++)

	{

		$tabelleninhalt .= "<td>Datensatz Zeile: $i Spalte: $j</td>";

	}

	$tabelleninhalt .= "</tr>";

}


echo "<pre style='margin: 0px;'>";

  echo $tabellenkopf;

echo "</pre>";


echo "<div style='height: 150px; overflow: auto;'>";

  echo $tabelleninhalt;

echo "</div>";


echo "</table>";

PS: Tabellenüberschriften übrigens mit th, nicht td

SatansEier · 21. September 2006

na ja ich bekomm keine zwei sauberen container hin.. die höhe die ich im zweiten container (inhalt) angebe, wird als abstand zum oberen bildschirmrand genommen...und abgesehen von dem "abstand" hat sich nichts an meiner ansicht verändert.

Anmelden

fixxer Tabellenkopf, scrollbarer Inhalt

Empfohlene Beiträge

SatansEier

Manitu71

SatansEier

Amstelchen

Manitu71

SatansEier

derJan

SatansEier

I C Q

SatansEier

SatansEier

derJan

SatansEier

Dein Kommentar

Fachinformatiker Jobs

Fachinformatiker.de, 2024 by SE Internet Services

Links

Fachinformatiker.de App

Kontakt

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

Umsehen

Aktivitäten

Stellenanzeigen

Blog

Über Fachinformatiker.de