How to pass `$(this)` as parameter to a "callready" function in Javascript

Question

The leanModal function triggers a modal with some parameters. One of this parameters is a function (ready) that will be executed once the Modal is open. The point is, I need to do some stuff inside that function (ready) just with the element (tag) which triggered the modal, so I need to pass $(this) as parameter to that function. The leanModal() function is provided by MaterializeCss which's the framework that I'm using.

I've been trying this, but thisTag is always undefined. I also have tried to pass directly $(this) to the function, but it also doesn't work at all, it's still undefined. So, how can I reach this?

$('.modal-trigger-editMedic').leanModal({
    thisTag: $(this),
    ready: function(thisTag){
        var refereeNum = thisTag.siblings("[name*='refereeNumToEdit']" )[0].value;
        $('#surname').val($("input[id*='medicNameToModal"+refereeNum+"'").val());
    }
});

Answer 1

Following the source code, .leanModal supports a ready function (which is triggered once the modal is visible) but doesn't bind or send the element which triggered the modal, the easiest way to fix this is to store a reference outside. To do so, you need to iterate over the triggers yourself instead of relying on that functionality of provided by this jQuery plugin.

Like so:

var $surname = $('#surname'); // you should store the selector as a reference 
                              // outside the loop for better performance

$('.modal-trigger-editMedic').each(function() {
    var $this = $(this); // this is the current item in the set of elements, 
                         // therefore our trigger element
                         // EDIT: using var makes this a local variable

    $this.leanModal({
        ready: function() {
            var refereeNum = $this.siblings("[name*='refereeNumToEdit']" )[0].value;

            $surname.val($("input[id*='medicNameToModal"+refereeNum+"'").val());
        }
    });
});