Using Modal Factory - Moodle 3.10

Using Modal Factory - Moodle 3.10

by Dave Emsley -
Number of replies: 2

Hi All,

I'm looking to use the Modal Factory as per https://docs.moodle.org/dev/AMD_Modal

However I'm struggling to get example 1 to actually work.

I've included it in the columns2.mustache file:

{{> theme_boost/head }}
{{#js}}
define(['jquery', 'core/modal_factory'], function($, ModalFactory) {
  var trigger = $("#modal-0");
  ModalFactory.create({
    title: 'test title',
    body: '<p>test body content</p>',
    footer: 'test footer content',
  }, trigger)
  .done(function(modal) {
    // Do what you want with your new modal.
  });
});

//The code below works

$("#modal-0").click(function(){
  alert("The paragraph was clicked.");
});
{{/js}}

The simple .click function works but the Modal doesn't.   What am I missing please?

Cheers

Dave


Average of ratings: -
In reply to Dave Emsley

Re: Using Modal Factory - Moodle 3.10

by Dave Emsley -
I cannot edit this but the issue is using "define" in the first line, should be REQUIRE

Note to moderators - You can delete this post if you wish but may be of use to others (although I'm going to edit the documentation anyway).
In reply to Dave Emsley

Re: Using Modal Factory - Moodle 3.10

by Richard Jones -
Picture of Plugin developers Picture of Testers
Hi Dave

We should get together on this as I have been struggling a bit with it and came here with questions too! I have an example here: https://github.com/richardjonesnz/moodle-mod_sandbox which may be overly simple but it does work.

The documentation reckons all new JavaScript from Moodle 3.10 must be written as ES6 modules but it doesn't seem enforceable.

Many of the examples in the documentation use jQuery which is also supposed to be discontinued for modules. However, since Booststrap 4 includes jQuery, again not sure how all this will work or what the plan is. Perhaps all will be clear by November?

https://docs.moodle.org/dev/Roadmap is interesting but still pretty vague on detail.

Cheers
Richard