Date Picker (and if date specified has passed)

• rdck

• August 13, 2013 at 7:37 am

Hi folks,

So I’m building a simple grid of events added to WordPress (using posts and a category) and have used a few ACF fields to help specify a few things. One of those things is a date picker field — this will refer to when an event starts and ends — two fields; one for each.

The css background styles on the grid use a grey and a red on hover. However, I was thinking it would be good to use an even lighter grey on the background if the event has passed.

So, what I’m wondering, is if there’s anyway to use the ‘event end date’ field I have created and if it’s passed the current date then it adds a class to the div element?

I’m not sure if the date picker has been used like this before but it would be good to know its limits.

Thanks in advance,
R

My current code in case this helps.

<div id="programme-<?php the_ID(); ?>" <?php post_class($postClass); ?>>
		<div class="grid_3">
			<div class="each-programme-content">
				<a class="each-programme-content-info" href="<?php the_permalink(); ?>">
					<?php if ( get_field('type_of_event') ) : ?>
						<span class="type-of-event"><?php the_field('type_of_event'); ?></span>
					<?php endif; ?>
					<?php if ( get_field('event_start_date') && get_field('event_end_date') ) : ?>
						<?php $start_date = DateTime::createFromFormat('Ymd', get_field('event_start_date'));
						$end_date = DateTime::createFromFormat('Ymd', get_field('event_end_date')); ?>
						<h4 class="date"><?php echo $start_date->format('d'); ?>&mdash;<?php echo $end_date->format('d F'); ?></h4>
					<?php elseif ( get_field('event_start_date') ) : ?>
						<?php $start_date = DateTime::createFromFormat('Ymd', get_field('event_start_date')); ?>
						<h4 class="date"><?php echo $start_date->format('d F'); ?></h4>
					<?php endif; ?>
					<h4><?php the_title(); ?></h4>
				</a>
			</div>	
		</div>
	</div>

• rdck

• August 13, 2013 at 8:04 am

I thought this might’ve worked; but throwing out an undefined variable…

$end_date_passed_check = DateTime::createFromFormat('Ymd', get_field('event_end_date'));
	
if ($end_date_passed_check < date('Ymd'))
{
    $date_passed = 'date-passed';
}

<div class="each-programme-content <?php echo $date_passed; ?>"></div>

• rdck

• August 13, 2013 at 8:14 am

And actually, I realised I hadn’t formatted the date, so have this now —

$end_date_passed_check = DateTime::createFromFormat('Ymd', get_field('event_end_date'));
		
if ($end_date_passed_check->format('Ymd') < date('Ymd'))
{
   $date_passed = 'date-passed';
}

But alas it’s adding the class randomly… not as it should be.

• rdck

• August 13, 2013 at 8:19 am

Looks like it’s to do with the fact it’s in a while loop?

while ( have_posts() ) : the_post();

• Elliot

• August 13, 2013 at 2:37 pm

Hi @rdck

Have you tested that get_field('event_end_date') returns a value?

• rdck

• August 13, 2013 at 6:11 pm

Hi @elliot,

Many thanks for your reply.

I am testing this by echoing out both the current date and get_field('event_date_date') with the format Ymd with each event to compare using:

echo $end_date_passed_check->format('Ymd');
echo '<br/>';
echo date('Ymd');

These all seems to be correct, but what it seems to be doing is when the first if statement is true, then it applies it to the rest of the elements. I think this might be a while loop error, but maybe you can help?

Here is what my output looks like http://goo.gl/xW3pwT

Many thanks,
R

• rootshift

• August 14, 2013 at 12:36 am

Hi mate,

Just wondering if you got this sorted? I want to create the same kind of functionality.

Basically I have an events page, where people can volunteer. We have a volunteer link, but obviously we don’t want this here if the event has passed.

So we need some kind of conditional logic saying, display the volunteer link, if the date has passed, dont. display none maybe.

Did you get a working solution? I would be grateful to hear how you went about doing this.

Many thanks

• rdck

• August 14, 2013 at 12:44 am

Hi @rootshift,

Just working through this with @elliot so close to a solution.

Once this has been worked out, I’ll post up the solution.

But basically, you should be able to do this for your button:

<?php
$event_end_date = DateTime::createFromFormat('Ymd', get_field('your_event_end_field'));
		
if ( $event_end_date->format('Ymd') < date('Ymd') ) { ?>
  <a href="#">Volunteer link</a>
<?php } else { ?>
  Volunteering no longer available 
<?php } ?>

• rootshift

• August 14, 2013 at 2:07 am

Hey @rdck,

Thanks for getting back to me so fast. That looks very promising and I’ll try have a look in to it myself but let me know if/once you get something working 🙂

Thanks buddy.

• rdck

• August 14, 2013 at 7:01 am

Okay, thanks for my friend Matt we managed to work this out.

Basically, my PHP skills failed me a little as $date_passed was defined in an if statement, thus it’s not always defined and you are getting PHP notices when it is not defined.

So, he suggested I either define $date_passed to something (null) or use isset or empty to check whether it has been defined.

So adapting my code to below, worked:

$date_passed = null;
if ( $end_date_passed_check->format('Ymd') < date('Ymd') ) {
$date_passed = 'date-passed';
}

I hope this post proves to be useful in applying specific classes to events that have passed using the ACF DatePicker.

Full code as follows:

<?php get_header(); ?>

<?php if ( ! have_posts() ) : ?>

<?php endif; ?>

<div class="container_12">
 
	<?php 
	
	while ( have_posts() ) : the_post(); 
	
	$end_date_passed_check = DateTime::createFromFormat('Ymd', get_field('event_end_date'));
		
	$date_passed = null;
		
	if ( $end_date_passed_check->format('Ymd') < date('Ymd') ) {
		$date_passed = 'date-passed';
	}
	?>
	
	<div id="programme-<?php the_ID(); ?>" <?php post_class(); ?>>
		<div class="grid_3">
			<div class="each-programme-content <?php echo $date_passed; ?>">
				<a class="each-programme-content-info" href="<?php the_permalink(); ?>">
					<?php if ( get_field('type_of_event') ) : ?>
						<span class="type-of-event"><?php the_field('type_of_event'); ?></span>
					<?php endif; ?>
					<?php if ( get_field('event_start_date') && get_field('event_end_date') ) : ?>
						<?php $start_date = DateTime::createFromFormat('Ymd', get_field('event_start_date'));
						$end_date = DateTime::createFromFormat('Ymd', get_field('event_end_date')); ?>
						<h4 class="date"><?php echo $start_date->format('d'); ?>&mdash;<?php echo $end_date->format('d F'); ?></h4>
					<?php elseif ( get_field('event_start_date') ) : ?>
						<?php $start_date = DateTime::createFromFormat('Ymd', get_field('event_start_date')); ?>
						<h4 class="date"><?php echo $start_date->format('d F'); ?></h4>
					<?php endif; ?>
					<h4><?php the_title(); ?></h4>
				</a>
			</div>	
		</div>
	</div>
	
	<?php endwhile; ?>

</div>
<div class="clear"></div>

<?php get_footer(); ?>

• padawantoni

• March 4, 2017 at 3:19 am

Hey guys. I’m facing this same problem, and I was able to apply @rdck solution on the “single-event page”, but not on the “loop of all events” page.

I need to check if the date of every event showed on the loop page has already passed and add an class to the <div class="evento-thumbnail">

My loop page:

<div class="conteudo-eventos-out">
<div class="conteudo-eventos-in">
									
					<?php $loop = new WP_Query( array( 'post_type' => 'evento', 'posts_per_page' => -8, 'post_status' => 'publish' ) ); ?>
					<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
					<div class="evento-thumbnail"><?php echo get_the_post_thumbnail(); ?></div>
					<div class="evento-titulo"><p><?php echo the_title(); ?></p></div>
                    <div class="evento-data">
					<?php if ( get_field('event_start_date') && get_field('event_end_date') ) : ?>
						<?php $start_date = DateTime::createFromFormat('Ymd', get_field('event_start_date'));
						$end_date = DateTime::createFromFormat('Ymd', get_field('event_end_date')); ?>
						<p class="date">Data: <?php echo $start_date->format('d/m'); ?> at&eacute; <?php echo $end_date->format('d/m'); ?></p>
					<?php elseif ( get_field('event_start_date') ) : ?>
						<?php $start_date = DateTime::createFromFormat('Ymd', get_field('event_start_date')); ?>
						<p class="date"><?php echo $start_date->format('d/m'); ?></p>
					<?php endif; ?>
					
					<?php endwhile; wp_reset_query(); ?>
                    </div>             

</div>
</div>