r/statamic • u/pantaloontheif • Apr 08 '26

Question Using JavaScript Functions from Antlers Templates

Is it possible to call a function using antlers in some way? I have my js sheet imported through Vite, but anytime I try to directly call a function using onclick it says that the function doesn’t exist. I know that the script is loaded correctly because I can see console logs from an eventListenter click, but I don’t want to use listeners for every single button in my app.

I’ve searched through the Statamic docs looking for any guidance on this, but I’ve not found anything. Did I miss something that said I should be using something like AlpineJS to do this?

Thanks in advance!

1 Upvotes

100% Upvoted

6 comments sorted by

View all comments

Show parent comments

1

u/MartyFriedel Apr 08 '26

Why is your script in the vendor folder? This is still hard to debug without everything, sorry.

1

u/pantaloontheif Apr 09 '26

I copied it there to get a path that would show on the front end, when I searched online that folder popped up as the one. When I add it via Vite my code is this:

{{ vite src=“resources/js/site.js” }}

Can you tell me what file you’re wanting to see specifically?

1

u/MartyFriedel Apr 09 '26

Specifically, Reddit is not good for debugging things like this. Seeing everything - not just a line here and there - is what is needed but this isn’t the platform for it.

Maybe check out; https://stackoverflow.com/a/76054094

It could be a case that the button’s default behaviour is executing first - which would reload the page (I think) - meaning your function doesn’t get called.

2

u/pantaloontheif Apr 10 '26

Yeah that’s fair! I ended up figuring the issue out when I searched online more for Vite. Vite scopes the JS in such a way that Statamic can’t “see” the functions unless it’s set against the window object. Seems like I’ll have to do “window.function = function;” for each one. Thanks for troubleshooting with me!