Foreach data from one table and then place inside the category they belong to from category table

[jack55]

I’m currently trying to build a FAQ page where all the faq is inside their own category as shown in the image. I’m using a foreach which loads all the faq data which are the accordions in the image but what i’m struggling with is grouping them by category id and then placing them in the category card? Does anyone know a good approach to this?

Thankyou very much!

Faq table consists of [name, content, date, cat_id, status]
Category Table consists of [name, content, date, type, status] e.g. FAQ Cat. I'm FAQ content, 07/09/2018, 2, 1

[rpkamp]

I normally do something along the lines of

$lastCatId = null;
foreach($rows as $row) {
    if ($row['cat_id'] !== $lastCatId) {
        // close previous category if one is open
        // begin card for new category
   }
   // print question and answer
    $lastCatId = $row['cat_id'];
} 

[jack55]

THANKYOU THANKYOU THANKYOU!!!

$lastCatId = null;
foreach($getAllFaq as $row) {
    if ($row['cat_id'] !== $lastCatId) {
        // close previous category if one is open
		echo'</div>';
        // begin card for new category
		echo'<div class="card"><div class="card-header">'.$row['cat_id'].'</div>';
   }
   // print question and answer
   echo '
  <div class="card-body">
    <b>'.$row['name'].'</b> '.$row['content'].'
  </div>';
    $lastCatId = $row['cat_id'];
}

[rpkamp]

Ah, but you don’t always have to put </div> when the category id changed. The first time it changes from null to the first category id and there is no div opened yet…

[jack55]

Ah ok, how do you suggest i make it optional? So it only loads the </div> when it has to?

Thanks

[jack55]

Am I being thick? The bit is causing issues but messing up the rest of the grid! Please clarify what you mean!

						<div class="row">
							<?php if( $getAllFaq == FALSE ) { ?>
							<div class="col-12">
								<div class="alert alert-primary shadow-1" role="alert">
									<b><i class="fas fa-info-circle"></i> No questions found!</b>
								</div>
							</div>
							<?php } else {
$lastCatId = null;
foreach($getAllFaq as $row) {
    if ($row['cat_id'] !== $lastCatId) {
        // close previous category if one is open
		echo'</div></div>';
        // begin card for new category
		echo'<div class="col-md-4"><div class="card h-100"><div class="card-header bg-white">'.$row['catname'].'</div>';
   }
   // print question and answer
   echo '
  <div class="card-body">
    <a href="'.FULL_ROOT.'/faq/'.$row['id'].'"><h5><b>'.$row['name'].'</b></h5></a>
	              <p class="toggledText">
                '.$row['content'].'
              </p>
  </div>';
    $lastCatId = $row['cat_id'];
} 
						} ?>
						
                        <div class="col-12">
							<div class="mt-4"><?php echo $pageLinks; ?></div>
                        </div>
						</div>

Thanks

[droopsnoot]

Set a flag when you open the div, and check it before you close it. If the flag isn’t set, don’t close the div.

[jack55]

What do you mean by flag thanks

[jack55]

Do you mean something like this?

$lastCatId = null;
foreach($getAllFaq as $row) {
    if ($row['cat_id'] !== $lastCatId) {
        // begin card for new category
		echo'<div class="col-md-4"><div class="card h-100"><div class="card-header bg-white">'.$row['catname'].'</div>';
   }
   echo '
  <div class="card-body">
    <a href="'.FULL_ROOT.'/faq/'.$row['id'].'"><h5><b>'.$row['name'].'</b></h5></a>
	              <p class="toggledText">
                '.$row['content'].'
              </p>
  </div>';
    $lastCatId = $row['cat_id'];
    if ($row['cat_id'] !== $lastCatId) {
        // end category
		echo'</div>';
   }
}

[rpkamp]

Well the special thing before the first category is that $lastCatId is NULL.

Does that help?

[jack55]

Yes I gathered that, so what am i doing wrong?

Are you saying it’s supposed to be like this?

							<?php if( $getAllFaq == FALSE ) { ?>
							<div class="col-12">
								<div class="alert alert-primary shadow-1" role="alert">
									<b><i class="fas fa-info-circle"></i> No questions found!</b>
								</div>
							</div>
							<?php } else {
$lastCatId = null;
foreach($getAllFaq as $row) {
    if ($row['cat_id'] !== $lastCatId) {
        // close previous category if one is open
	if($lastCatId != null) :	echo'</div></div>'; endif;
        // begin card for new category
		echo'<div class="col-md-4 mb-4"><div class="card h-100"><div class="card-header bg-white">'.$row['catname'].'</div>';
   }
   // print question and answer
   echo '
  <div class="card-body">
    <a href="'.FULL_ROOT.'/faq/'.$row['id'].'"><h5><b>'.$row['name'].'</b></h5></a>
	              <p class="toggledText">
                '.$row['content'].'
              </p>
  </div>';
    $lastCatId = $row['cat_id'];
} 
						} ?>

I’m lost! Your help is much appreciated, please can you be more specific for an amateur! Thanks

[rpkamp]

Yes that looks like it should work. What’s the problem?

[jack55]

Yes, there is a slight issue which is basically where the categories are single card instead of one card per category which is odd and why I was acting so dum above!

Here is my FAQ table

Here is what is generated:

[jack55]

Don’t worry! The reason was that I needed to ORDER BY cat_id, now all working thanks very much!

If there is not orderby and i add a card that gets in the way or 2+2 then it breaks the box and thinks itself a new category!