modxcms / fred

The friendly front-end editor for visual, drag-and-drop content building in MODX CMS
https://fred.modx.com
MIT License
57 stars 25 forks source link

Initializing JS function from data-fred-on-drop not working. #465

Open BigBlockStudios opened 1 year ago

BigBlockStudios commented 1 year ago

I'm trying to reinitialize Zurb Foundation interchange when an element is dropped into a dropzone. It does not appear to be working, I'm not getting any JS errors or otherwise. just "not happening"

<section id="hero" class="hero about background-cover align-items-end default-height" 
data-interchange="
[{{interchange_hero_small}}, small],
[{{interchange_hero_medium}}, medium],
[{{interchange_hero_large}}, large],
" 
data-fred-on-setting-change="reinitInterchange"
data-fred-on-drop="reinitInterchange">

  ........ some markup .......

</section>

I placed the reinit script in my app.js

`reinitInterchange();

function reinitInterchange() { console.log('reinitializing interchange') } `

I do get a log entry when the page loads, not when I drop the hero section into a dropzone.

Not sure what I can look at, the docs are pretty clear about just inserting a data attribute in the dropped markup.

BigBlockStudios commented 1 year ago

My error, this does work as advertised. The error being I did not fully understand a "global" js script... This works.

window.reinitLazyInterchange = function() { console.log('init'); $('.reinitondrop').foundation().unveilInterchange(); }

Though is there an event when Fred initially loads? Would be useful for disabling things like lightbox galleries....