Hi everyone,
Currently I'm struggling with a filter option and I hope somebody can help or advise me the right way to this.
What I want is an index page where campaigns are shown and where I can filter the campaigns by year.
Each campaign has a datetime field with the output set to "j F Y", so it shows "1 April 2016" in the frontend.
The dates are unique for each campaign, but there can be multiple campaigns in the same year.
The page structure is:
-client
--campaign-a
--campaign-b
--campaign-c
--campaign-d
This is the PHP code I use on the client page to display all the campaigns.
$campaigns = $page->children("sort=sort");
foreach ($campaigns as $campaign) {
if($campaign->campaign_description) {
echo '<div class="campaign-description info">';
echo '<h2>' . $campaign->title . '</h2>';
echo '<p>' . $campaign->campaign_description . '</p>';
// Todo remove only for testing
$campaignDate = $campaign->campaign_date;
$campaignYear = substr($campaignDate, -4);
echo '<i>' . $campaignDate . '</i>';
echo '</div>';
}
}
$campaignYear is where I see the years, 2015, 2016, 2017 and so on.
Here I create the dropdown to show the unique years:
if (count($campaigns)) {
// Store unique Years
$arr = array();
foreach ($campaigns as $campaign) {
$campaignDate = $campaign->campaign_date;
$campaignYear = substr($campaignDate, -4);
$arr[] = $campaignYear;
}
$unique_years = array_unique($arr);
// Show dropdown with unique years
echo '<select id="campaign-date-select">';
foreach($unique_years as $year) {
echo '<option value="' . $year . '">' . $year . '</option>';
}
echo '</select>';
}
I read a couple of articles, for example this: https://processwire.com/talk/topic/8513-sort-with-select-dropdown/
but I can't figure out how to dynamically change the output of the campaigns, based on the input of the select options.
Maybe the datetime field is not the best option, or maybe I have to use URL segments and JavaScript to combine something...
Any help or advise is welcome!