|
devonto
|
March 22, 2017 at 4:21 am
I’m looking to alter the “filter by datetime” option to only filter by date.
For example, having multiple events occur on one day, it’d be useful to filter the events to show all that happen on that day; rather than filtering by date and time.
In my scenario, there are three events per week – full-day, half day (morning) and half-day (afternoon).
I’d ideally wish to filter using the drop down to show only those events in the week, right now, it shows all three options in the dropdown.
Perhaps a screenshot/mockup explains it best – current on the left, ideal on the right.
|
|
Tony
|
March 23, 2017 at 10:37 am
Hi there,
I checked into this and currently its not possible to change the output of the ‘datetime selector’ without basically creating your own version of it from scratch.
EE pulls all of the unique datetimes within an event and loops over those for the dropdown, it then adds classes based on those datetimes to each of the tickets in the event used to show/hide them.
The classes added to each ticket used to hide the tickets is done through JS within the datetime selector so you can’t simply swap out the datetime used in the dropdown, you’ll need change those classes are constructed to be able to filter the tickets correctly.
In short to do the above will take a fair amount of custom code from a developer and is not something we can provide support for. If you are not currently working with a developer we have a list of some familiar with Event Espresso here:
https://eventespresso.com/developers/event-espresso-pros/
|
|
devonto
|
March 23, 2017 at 11:55 am
Hi Tony, I am a developer; but hoped there would have been something quicker that could have been suggested.
Any tips or suggestions?
I believe I’m looking at DatetimeSelector.php and ticket_selector.js?
How would you recommend overriding classes/functions/js when they’re so deep in the core?
|
|
Josh
|
March 23, 2017 at 12:58 pm
You can create your own JavaScript to handle those filters, and enqueue the JavaScript on the pages that have the ticket selector. You do not need to override Event Espresso’s classes or functions to accomplish this.
|
|
devonto
|
March 24, 2017 at 6:23 am
Hi Josh, from Tony’s explanation – and from looking in the code – this cannot be done without editing the PHP files.
The JavaScript is not adding the classes dynamically, they are being added to the HTML code within PHP.
Am I missing something obvious here?
|
|
devonto
|
March 24, 2017 at 7:03 am
I have obtained the desired effect with the following code changes, these are, though, to the core (which I don’t necessarily want).
On DatetimeSelector.php, pass in NULL values for the $tm_format and $separator parameters when calling date_and_time_range()
In EE_Datetime.class.php, comment out the following line:
$tm_format = ! empty( $tm_format ) && $tm_format!==FALSE ? $tm_format : $this->_tm_frmt;
And, to tidy up, ticket_selector.js required additional rows to be hidden (which I believe is a current bug anyway)
From line 56:
if (display) {
$ticket_selector_row.removeClass('ee-hidden-ticket-tr');
active_rows++;
} else {
$ticket_selector_row.addClass('ee-hidden-ticket-tr').find('.ticket-selector-tbl-qty-slct').val(0);
}
Should become
if (display) {
$ticket_selector_row.removeClass('ee-hidden-ticket-tr');
$ticket_selector_row.next('tr').removeClass('ee-hidden-ticket-tr');
active_rows++;
} else {
$ticket_selector_row.addClass('ee-hidden-ticket-tr').find('.ticket-selector-tbl-qty-slct').val(0);
$ticket_selector_row.next('tr').addClass('ee-hidden-ticket-tr');
}
This outcome can be viewed here: http://bit.ly/2mz3pKl
Of course, I’d love for this to be added as a full feature into the core and would be happy to help provide any necessary code.
Other than that, your suggestions on how to make this a bit more permanent would be appreciated.
|
|
Josh
|
March 24, 2017 at 10:38 am
The JavaScript is not adding the classes dynamically, they are being added to the HTML code within PHP.
Can you not use the existing HTML classes that are already in the markup? Or even add classes with your JavaScript?
If you want to make your changes more permanent, you can submit a pull request that adds a filter hook or two to the PHP files where you want to filter what’s output. The developers will generally accept pull requests that include the addition of filter hooks that follow the Event Espresso filter hook naming conventions.
https://github.com/eventespresso/event-espresso-core/blob/master/docs/A–Best-Practices/ee-actions-and-filters.md
Ideally you should use your own JavaScript solution for hiding/showing the table rows. If you go with the less than ideal route where you hack the existing JavaScript, you could dequeue the core copy’s JS file, then enqueue your modified copy.
https://developer.wordpress.org/reference/functions/wp_dequeue_script/
https://developer.wordpress.org/reference/functions/wp_enqueue_script/
|
|
devonto
|
March 25, 2017 at 9:17 am
Can you not use the existing HTML classes that are already in the markup? Or even add classes with your JavaScript?
When you turn the option off, the classes are removed; so it would require some CSS to force-hide the default button and add our own in.
|
|
Josh
|
March 27, 2017 at 12:00 pm
Not all the classes are removed for each table row are removed though. You can also add your own button by using one of the hooks available that fire above the Ticket Selector. e.g.
AHEE__ticket_selector_chart__template__before_ticket_selector
|
