Source button and content of Raincheck Click

Hello, I would like some help to understand if this situation is feasible.

Joe released an update for Raincheck where he added the ability to load on demand (by clicking on the button with the same class as Raincheck click added) a Raincheck content.

I don’t have F6 (where the working demo of this situation is contained), but thanks to @Konfuzzious Erwin who sent me this link:

you can see it working.

I use Raincheck in Source sites for its other functions, but I also tried this new update by inserting the same Raincheck class on a Source button, but it doesn’t work.

Can you take a look at this link where Raincheck content is loaded on click of an F6 button, to see if it is possible to load it with a Source button via the same class?

Thank you.

1 Like

Looking at the code I see this:

<button class="button medium raincheck-load" type="button">Show picture above</button>

So the class appears to be raincheck-load and not raincheck

Yes, the class in this case is raincheck-load,
however the class must be the same in both the button and the Raincheck click.
But in a Source button inserting in extra CSS classes doesn’t work.
Perhaps in the Custom Attribute of the source button you need to enter a name(?) and the value of the class(raincheck-load) ?

it’s like the trigger is missing…

Show a screenshot of what exactly you are entering into the button link.

What does the Raincheck documentation say exactly?

the documentation just says to put the same class as Raincheck Click in the button.
I think it only works with F6 at this point, otherwise it doesn’t explain itself

Remove that class from the main button class.

Then in the link settings click the small plus symbol.

Then enter class in the left pane, and enter the raincheck class name in the right.

I believe that is what was meant but it is ambiguous.

You may also need to add the jQuery stack

Source doesn’t include anything you might not need by default. If you want / need to use jQuery then you can add this stack. Note: Most third party stacks that need jQuery will generally load this themselves anyway.

the name of the class? which one should i put?

because I already tried with:
“class” “raincheck-load”
“onclick” “raincheck-load”
“click” “raincheck-load”

but nothing to do, it does not trigger

Did you add the jQuery stack?

Other than that I can only suggest you contact JW.

added jQuery…
it does not work.

not even with buttonPlus2

I wanted to hear @Webdeersign e @habitualshaker Stuart’s opinion first


Also not sure what you are trying to achieve overall exactly, but you can show and hide things with whats built into Source. Eg create a 1 item grid in a grid plus, and then use the category feature to show/hide the image.

but I was trying to figure out how Raincheck Click worked, as I already use Raincheck a lot.

tried that too. No luck.

Raincheck works with F6 just by providing a class. I think for it to work with other stacks, these stacks should have the same mechanism, don’t they? Stuart has been tagged. Hopefully he can shed some light on this?
Or maybe @joeworkman ?

Raincheck is for lazy loading.

1 Like

I don’t know anything about Raincheck but i would have thought that entering the class name in either the Stack’s CSS box or the custom attribute box would be fine (if the name matches with your Raincheck name). If you can publish a page where it doesn’t work with the Source button then it might be easier to troubleshoot.

I’m not sure to be honest @Gianluca

Nothing obvious jumping out to me and i haven’t got time at the minute to do a deep dive. Might well be one for Joe.

thanks 👍

Thanks for your help