Tabel splitsen en meerdere pagina's

Door Ray Mond op 19-08-2022 10:06

6.064 views

Goedemorgen allen!

We hebben een site (soort toprank site) waarbij men sites kunnen aanmelden, doormiddel van clicks komen ze hoger op de pagina...

Alles werkt ook tot zover alleen willen wij de tabel die we hebben opsplitsen in 3 per pagina en wanneer we naar pagina 2 gaan klopt de telling niet meer.

Op pagina 1 zie je netjes nummer 1, 2, 3 enzovoor enzovoort.. Tot aan 30 toe maar wanneer we naar pagina 2 gaan begint de telling opnieuw, hier zal juist nummer 31 dan moeten komen.

Verder willen wij dus ook in plaats van 1 tabel die we nu hebben 3 tabellen per pagina laten zien met 10 records per tabel zodat we daar tussenin een advertentie ruimte kunnen maken.

Wie is hier eventueel heel handig in en kan dit snel vinden doormiddel van onze code?

Onze code bovenaan de pagina:


$per_pagina_record = 30;

if (isset($_GET["pagina"])) {    

$pagina  = $_GET["pagina"];    
        
}	else {    

$pagina=1;    

}

Dan onze tabel:


<table class="tabel">
  <tr>
    <td class="tabelkop" style="width:5%;text-align: center;">Nummer</td>
    <td class="tabelkop" style="width:85%;text-align: center;">Naam en content</td>
  </tr>
  <?php
	$sql = "SELECT * from websites WHERE `status` = '2' ORDER BY aantalin DESC LIMIT $start_from, $per_pagina_record";
	$return = $conn->query($sql );
						
	while ($row = $return->fetch_object()){
		
	if($i%2 == 0)
    {
        $color = "row1"; // Kleur 1
    }
    else
    {
        $color = "row2"; // Kleur 2
    }
    ++$i;
		
	echo '<tr class="'.$color.'"><td class="rank">'.$i.'</td><td class="col2">  <div style="text-align: center;"> <a href="index.php?uit='.$row->link_id.'" target="_blank"><img src="'.$row->banner.'" class="b468" alt="'.$row->site_naam.'"></a></div>  <a href="index.php?uit='.$row->link_id.'" target="_blank"><strong>'.$row->site_naam.'</strong></a><br>
	'.$row->beschrijving.'  </td>
	</tr>'; } ?>
</table>

En vervolgens onze pagination:


<div class="pagination">
<?php  
	$query = "SELECT COUNT(*) FROM websites WHERE `status` = '2'";
	$rs_result = mysqli_query($conn, $query);
	$row = mysqli_fetch_row($rs_result);
	$total_records = $row[0];
          
	echo "</br>";

	$total_paginas = ceil($total_records / $per_pagina_record);
	$pagLink = "";
      
	if($pagina>=2){
		echo "<a href='index.php?pagina=".($pagina-1)."'><b> Vorige pagina </b></a>";
	}
                   
	for ($i=1; $i<=$total_paginas; $i++) {

	if ($i == $pagina) {
	
		$pagLink .= "<a class = 'active' href='index.php?pagina=".$i."'><b>".$i."</b> </a>";
	
	}	else  {
		
		$pagLink .= "<a href='index.php?pagina=".$i."'><b>".$i."</b> </a>";
		
		}
	};
	
	echo $pagLink;
  
	if($pagina<$total_paginas){
		
		echo "<a href='index.php?pagina=".($pagina+1)."'><b> Volgende pagina </b></a>";
	
	}
?>
</div>

Dit werkt tot zo ver echt goed, althans voor de homepagina, wanneer we naar de 2e pagina gaan begint de telling opnieuw en we zouden graag de tabellen willen verdelen.

Alvast bedankt voor het lezen en helpen!

Jan Koehoorn

23-08-2022 18:30

Ray Mond op 23/08/2022 18:28:52

Wat ik begrijp gaat dat om aantal items en dan welke pagina en dan naar de volgende pagina toch?

Nee. Die regel zorgt ervoor dat op een pagina van 30 items er na nr 10 en nr 20 een tussen-lijn geprint wordt.

- Ariën -

23-08-2022 18:39 gewijzigd op 23-08-2022 18:40

Eigenlijk wel grappig, want je liet eerst al zien dat je de rijen om en om kleurt, met deze code:
<?php
if($i%2 == 0)
{
$color = "row1"; // Kleur 1
}
else
{
$color = "row2"; // Kleur 2
}
?>

Die code kan je dan met een kleine aanpassing ook gebruiken voor het splitsen van de een rij om tussen elke tien records een advertentie te tonen. Los van dat kan je rijen ook prima met CSS om-en-om kleuren.

Ray Mond

23-08-2022 18:43

@Jan dat is inderdaad wel wat ik wou dat de hele tabel zichtbaar is, 10 records aangeeft, vervolgens een stuk voor de advertentie wat Ariën aangeeft...

Bij die van jou Jan vraag ik me dan af hoe ik die er precies tussenkrijg en de manier wat Ariën inderdaad aangeeft klopt, zo gebruik ik het nu voor de kleuren maar om dan een heel tabel te doen????

Sorry dat het misschien wat 'dom' overkomt ... ik snap best wel haha maar hier heb ik toch wat moeite mee geloof ik :)

Ivo P

23-08-2022 18:52

Bij je kleurtjes kijk je of een getal deelbaar is door 2 ( $i % 2 geeft rest 0).

Nu wil je om de 10 regels iets doen.
Dus dan zou je willen weten of de teller $i deelbaar is door 10.

En in dat geval voeg je een </table> toe.

En als je daarna checkt of $i % 10 gelijk is aan 1 (dus je hebt regel 11) dan weet je dat je een <table> nodig hebt.
En dat geldt precies zo voor teller = 1, of 21.

(aangenomen dat je teller bij 1 begint te tellen.
Begin je met $1 =0, dan moet je dus je tabel afsluiten bij $i % 10 === 9 en beginnen als $i % 10 === 0)

Ray Mond

23-08-2022 18:55

De teller begint inderdaad bij 1 dat klopt helemaal, maar ik dacht zelf dat ik dan de tabel echt zou moeten verdelen in 3 stuks? Aangezien ik er dan advertentieruimte tussen wil hebben.

Wanneer ik het doe met </table> dan komt er natuurlijk niet iets tussen toch?

Jan Koehoorn

23-08-2022 19:57 gewijzigd op 23-08-2022 20:01

Mijn vorige voorbeeld, iets aangepast zodat het met <table> tags werkt:


<?php
$get        = (object) $_GET;
$pag_size   = 30;
$group_size = 10;

if ( ! empty($get->pag)) {
    $number_first = ($get->pag - 1) * $pag_size + 1;
    $number_last  = $number_first + $pag_size;
}
?>

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <style>
    	body {font: 14px Verdana;}
    	table { border-collapse: collapse; border: 1px solid #666; margin:  10px 0;}
    	td { padding: 8px; }
    </style>
</head>

<body>
<?php
if ( ! empty($number_first)) {
    printf('<table>');
    for ($i = $number_first; $i < $number_last; $i++) {
        printf('<tr><td>This is item nr:</td><td> %d</td></tr>', $i);

        if ($i % $group_size === 0 && ($pag_size * $get->pag) !== $i) {
            printf('</table><table>');
        }
    }
    printf('</table>');
}
?>
</body>

</html>

Edit:
Nog een tip: je kunt table-rows heel makkelijk om en om kleuren met deze simpele CSS regel. Geen php logica voor nodig dus:


tr:nth-child(even) { background: lightblue; }

Ray Mond

23-08-2022 20:07

Ik snap ergens bovenstaande code wel maar dan loop ik natuurlijk tegen het volgende aan...

Tussen de tables door wou ik advertentie ruimtes maken... die kan ik hier nu natuurlijk niet tussenplaatsen dan toch?

- Ariën -

23-08-2022 21:30

Waarom zou dat niet kunnen?
je hoeft eigenlijk je tabel niet te beëindigen. Je kan ook een colspan op je td plaatsen als het steeds het tiende item is.

Ivo P

24-08-2022 08:52 gewijzigd op 24-08-2022 09:32


<?php 
  function include_ad() 
  {
       echo '<div>advertentie</div>';
  }
?><!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <style>
        body {font: 14px Verdana;}
        table { border-collapse: collapse; border: 1px solid #666; margin:  10px 0;}
        td { padding: 8px; }
    </style>
</head>

<body>
<?php 
  $maxregels = 10;
 
   $i = 0;
   while ($row = $return->fetch_object()) : 
      $i++;
      if($i % $maxregels === 1) {
          <table>
      }   
   ?>
   <tr>
      <td><?= $i ?></td>
      <td>je data uit $row</td>
   </tr>
   <?php  if($i % $maxregels === 0) : ?>
      </tabel>
       <?php include_ad() ?>
   <?php endif ?>

<?php
   endwhile;
   // hadden we mogelijk de tabel nog niet afgesloten wegens bijv. 15 records? 
   if($i % $maxregels !== 0) : ?>
    </table>
   endif; ?>
?>

</body>

</html>

Onbekende gebruiker

24-08-2022 09:32 gewijzigd op 24-08-2022 12:47

Gaat het niet een beetje ver om modulo uit te leggen terwijl de operator ('%') ook gewoon in de PHP handleiding staat?
https://www.php.net/manual/en/language.operators.arithmetic.php

Ray Mond op 23/08/2022 20:07:12
[...]Tussen de tables door wou ik advertentie ruimtes maken[...]

Hoe het resultaat moet worden hangt af van of je de advertenties als een rij in de tabel wilt hebben, of dat je echt de hele tabel wilt afsluiten en na de advertentie een nieuwe tabel wilt beginnen. Visueel hoeft het geen verschil te maken, maar 'men' heeft lang geleden bedacht dat HTML-tabellen niet voor opmaak gebruikt mogen worden. Als je dat gewoon lekker wel doet, kan je in de foreach lus iets als dit opnemen (let op, incomplete pseudo code!):


let mut index = 0;
let ads = 10;
for rij in data {
  buffer.push_str("<tr>[inhoud van rij]</tr>");
  if (index % ads) == 0 {
    buffer.push_str("<tr><td colspan="4">[advertentie]</td></tr>");
  }
  index += 1; 
}
?>

Het gaat even om het idee. Het getal 4 is het aantal kolommen in de tabel.

Reageren

Inloggen om te reageren