Put Div around Month/Grid View

[Patrick Sasser]

I’m trying to simply wrap a div around the just the grid/month view calendar only. So I’m using this code…

http://pastebin.com/Mq9GzA1Qc

This works perfectly on desktop versions of the site, but when I go open it up on mobile no events are loaded below the calendar. So by putting a closing div in tribe_events_after_the_grid() it breaks it. If I add anything else instead of closing div like just a simple string it works fine on desktop and mobile.

The page that I’m working on is this one…
http://www.thecrossingchurch.com.php53-15.ord1-1.websitetestlink.com/calendar/2015-12/

Which is working, but the second that I add the code that is in the pastebin it stops working (the mobile view)

Any thoughts or suggestions as to what I can do to fix this? Like I said I just want the div around the calendar table.

Thanks,
patrick

[George]

Hey Patrick,

Thanks for reaching out! I checked your PasteBin but it unfortunately seems to be empty or deleted or something:

Can you try uploading that again and link to the new version of that code? Curious what you’ve tried already.

—

Next, can you confirm what versions of both The Events Calendar and Events Calendar Pro are active on your site?

Thank you!
George

[Patrick Sasser]

Here’s another link to a pastebin…

http://pastebin.com/PWK9y0k8

Here’s a screenshot if that doesn’t work.

http://puu.sh/lf9Aq/ab66f2a370.png

Sorry about that. For events calendar its 3.12.5 and for pro its 3.12.6

Let me know.

Thanks,
patrick

[George]

Thanks for this Patrick! The code is fine so I’m a bit perplexed, to be honest, about why the issues that you described would manifest on mobile views…weird.

Can you elaborate on what your exact goals are for having this wrapper element to begin with? Based on what you’re trying to achieve there might be a better way to this that uses the existing code, or some other code modification, which might reduce issues.

Thank you so much for your patience with this!

Cheers,
George

[Patrick Sasser]

Its just a design element. I’m basically trying to add some padding and some border around the calendar only. Here’s the calendar in action http://www.thecrossingchurch.com.php53-15.ord1-1.websitetestlink.com/calendar/…

I’ve pointed out the border in this screenshot….
https://drive.google.com/file/d/0Bx7TM-VEnOZtVV9KbC03dnFDdTg/view?usp=sharing

So you can see that it is working there. And when I go down to mobile then it won’t load anything below the calendar events where the mobile events should appear. I tried adjusting the priority of the action

add_action('tribe_events_after_the_grid', 'closingCalendarWrapper', 500);

by putting in 500 at the end, but doesn’t seem to do anything. The moment that I comment out that function it starts to work. My guess is that it is a jQuery path somewhere that is using .parent() or .children() or something to find the location and I’ve changed the path to it.

Let me know what you think.

patrick

[George]

Thanks for elaborating on this, and for your patience – one thing I’m still a bit confused by is the nature of your problems in the mobile view. In mobile view for me, everything renders fine:

(The rest of the site footer renders and such, just not included in the screenshot).

Do you find this to not be the case? If so, can you scare a screenshot of your mobile problems specifically?

Thank you so much for your patience with this! Just trying to figure out exactly what you’re looking for so I can best be of help here! 😀

Sincerely,
George

[Patrick Sasser]

I took out the code to add the wrapper. Notice now when you click on one of the dates on the mobile view it pops up the events for that date below the calendar…

http://puu.sh/lgNAW/5e747bb477.png

Make sense??

So the stuff that says Women’s Bible Studies and Mizzou Faculty won’t ever load if the wrapper is in there.

Thanks much,
patrick

[George]

Hey Patrick!

Thanks so much for your patience here, and for clarifying the problem. I apologize for the delay – I actually dug a bit deeper here and found the source of the problem, which was an over-specific JavaScript selector in our code.

I have submitted a patch for this bug, which you can see here → https://github.com/moderntribe/the-events-calendar/pull/440

However, it could take until the next maintenance release before that fix is actually included in the codebase, if it passes code review and all that…

So unfortunately your best option would be to edit core plugin code directly, which if you wanted to do you could use the Pull Request I linked to above to see what exact code needs to be modified to fix this.

I’m sorry about the slowness of this fix, and that a bug exists at all Patrick! But I’ve found the bug and fixed it in our code base – just a matter of releasing it to the world now 🙁

Thank you so much for your patience!
George

[Patrick Sasser]

Boom, thanks much. I put your fix in and it worked perfectly. I thought it was something specific to a jQuery path. I just updated that core file. And hopefully this will be in the next release so my changes aren’t overwritten??

Have a great day,
patrick

[George]

Awesome Patrick!

It just got merged into the main codebase, so yes hopefully it will be in the very next release; worst case scenario would be the release after next.

Thank you for your patience with this!

Cheers,
George

[Geoff]

Hey there,

Just jumping in to let you now that the patch for this issue is included in 4.0.1 and it just released today. Keep your eyes open for the update and please do let us know if any other issues pop up and we’d be happy to help. 🙂

Cheers!
Geoff

[Author]

Posts