The change event in comibination with query selector

Hi,

It seems that then you select a different option in the input, e.g. “Top mounted cover/Integrated cover”, the UI is rebuilt and the original HTML elements are replaced/recreated with identical but new elements (seems like you’re using jquery UI for that). That’s why the event listener doesn’t work after selecting a new option: the original HTML element the listener was assigned to was deleted and the new one apparently didn’t inherit any user-created event listeners (besides the ones that jquery UI automatically adds).

kubuz wrote:

Do you think there is another event trigger approach i could use?

Yes, I think you can use the jquery UI custom “remove” event, but it’s mostly a javascript solution.

I noticed that there are several dynamic UI elements which, if you make some changes to them, lead to resetting of the whole input form. But the one of the root HTML elements with the id “oDocumentContent” is the one that is always recreated after the changes. So you can just make a function that listens to the “remove” event for “oDocumentContent”:

function detectFormReset() {
    var content = parent.document.getElementById('oDocumentContent');
    parent.$(content).on('remove', detectFormReset);
}

– now if you call this function once somewhere in your application, it becomes a callback for the moment when you need to reset listeners in your puzzles logic.

So, I’d recommend to make a procedure in puzzles for registering all event listeners that you need, something like that:

– and now you need to call that procedure programmatically from the detectFormReset() function:

function detectFormReset() {
    var content = parent.document.getElementById('oDocumentContent');
    parent.$(content).on('remove', detectFormReset);

    v3d.puzzles.procedures.setupListeners();
}

After that there’s nothing left to do but to call detectFormReset() somewhere in your application’s js file (for example in the runCode function) to start all of that detecting&resetting logic.

This might be obvious or not but jyst to be sure do you have your “setup Listeners” procedure have it’s call tag somewhere?

Surely you do.
(Not calling you Shirley! 😜 )

I’m not actively following what your all taking about but I just wanted to say did you make your procedure call tag ..

Because I’ve on many occasions sat in plundering wasting hours..
Then realizing I hadn’t.

So.just saying

kubuz wrote:

Do you guys have an idea why:
– v3d.js
– Aquatop.js (its MyAwesomeApp.js)
– Aquatop.css
…
isn’t available in the sources tab ?

I looked at the sample app you shared in the first post and saw that v3d.js and your application scripts are bundled within one file RequestReducedScripts.js:

And I guess the css file is bundled in a similar way in RequestReducedScripts.css