Change Datepicker in Map view to display 'Months' rather than 'Days'

[eightlane]

Hi,

We would like to change the Datepicker in Map view to display ‘Months’ (like you see when in Month view) rather than ‘Days’. We need this because our users need to be able to look up events by month, rather than selecting a specific day and we need to keep the Map view in place.

Thanks

[Barry]

Hi!

There are a few different ways you could tackle this – but there are quite a few angles you’d need to consider and it’s broadly speaking a more advanced customization than we can help you with. I’m not honestly sure if you can adapt the datepicker format after it has already been registered (but if you want to research this in more depth, Datepicker for Bootstrap is the library we’re using).

It may simply be easiest to remove the existing date selector and replace it with your own, using some code like this:

add_action( 'init', 'replace_tribe_bar_search_field', 50 );

function replace_tribe_bar_search_field() {
	$callback = array( TribeEvents::instance(), 'setup_date_search_in_bar' );
	remove_filter( 'tribe-events-bar-filters', $callback, 1, 1 );
	add_filter( 'tribe-events-bar-filters', 'replacement_date_field' );
}

function replacement_date_field( $filters ) {
	array_unshift( $filters, array(
		'name' => 'custom-date-search',
		'caption' => 'Date',
		'html' => '<input type="text" name="datesearch" value="Some date" />'
	) );
	return $filters;
}

From there need to set up your own Javascript to ensure the datepicker is attached to your replacement date field (that would let you control the format – you could also leverage the same library we use) and you’d probably also need to adapt the HTML or else otherwise style it with additional CSS to really make it mesh nicely.

Do bear in mind also that map view is essentially a list view – so though you might effectively force it to show a list starting on the 1st of a given month it won’t ordinarily be limited only to events in that month unless you execute some further customizations.

I hope that at least gives you a few ideas you can explore – and good luck 🙂

[Author]

Posts