I have a custom post type called 'Products'
Within products there is a custom field called 'Sub Category' (selsubcat) which contains 14 different categories.
These categories are; CAM / REC / ACC / SWH / NET / MON / HDMI / ENC / SIGNS / PIR / WIFI / POLE / SOUND.
What I am trying to do display all the products within a different tab, where the tabs are the sub categories, and each tab will display the products for that category. At the moment I've defined the meta_value
as 'CAM' and this is displaying all the products with the category 'CAM' within the #tabs-1
div - which is correct.
I now need to somehow loop each category and display the products in the other 13 tabs.
So #tabs-1
will show all the products for the category 'CAM', #tabs-2
will show all the products for the category 'REC' and so on...
Here is what I have at the moment:-
<div id="tabs">
<ul>
<?php
if( have_rows('sub_category', 'option') ): $cat_increment = 1;
while ( have_rows('sub_category', 'option') ) : the_row(); ?>
<!-- Tab Sub Categories -->
<li><a href="#tabs-<?php echo $cat_increment; ?>"><?php the_sub_field('category_name'); ?></a></li>
<?php $cat_increment++; endwhile;
else : endif;
?>
</ul>
<?php
$posts = get_posts(array(
'posts_per_page'=> -1,
'post_type' => 'products',
'order' => 'ASC',
'meta_key' => 'selsubcat',
'meta_value' => 'CAM'
));
if( $posts ): ?>
<div id="tabs-1">
<table id="table-products" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th class="hidden">id</th>
<th>Image</th>
<th>Product Code</th>
<th>Description</th>
<th>Cost</th>
<th>Qty</th>
<th>Total Cost</th>
<th>Options</th>
</tr>
</thead>
<tfoot>
<tr>
<th class="hidden">id</th>
<th>Image</th>
<th>Product Code</th>
<th>Description</th>
<th>Cost</th>
<th>Qty</th>
<th>Total Cost</th>
<th>Options</th>
</tr>
</tfoot>
<?php foreach( $posts as $post ):
setup_postdata( $post );
?>
<tbody>
<tr>
<td class="hidden"><?php the_ID(); ?></td>
<td><span class="product-image" style="background:url(<?php the_field('image'); ?>);"></span></td>
<td><?php the_field('code'); ?></td>
<td><?php the_field('description'); ?></td>
<td><?php the_field('cost_price'); ?></td>
<td><input type="text" /></td>
<td><input type="text" /></td>
<td><input type="button" class="add-row" name="add-row" value="Add"></td>
</tr>
</tbody>
<?php $product_increment++; endforeach; ?>
</table>
</div>
<?php wp_reset_postdata(); ?>
<?php endif; ?>
</div>
I'm stuck at this point so any help would be much appreciated!