MeteorJS Blaze.getData() occasionally returns undefined

109 views Asked by At

I'm currently rendering bootstrap modals on my webpage using MeteorJS's "renderWithData" method to load each template when it's needed.

I'm running into an issue where my helper methods which access the data in the modal using "Blaze.getData()" will occasionally return undefined and I'm unsure how to fix that.

The only way I've been able to replicate the issue is by constantly creating/destroying the modals and there doesn't seem to be anything that specifically causes the issue.

Here are the steps I've been taking:

1) I instantiate the modal with the proper data

Template.Courses.events({
'click .share-course': function (e,t) {
    var courseID = $(e.target).data('courseid');

    Template.instance().activeCourse.set(
        createModalWithData(
            {
                currentInstance: Template.instance().activeCourse.get(),
                template: Template.Enrollment_Generator,
                dataToRender: {courseID: courseID}
            }
        ));

    $('#generateEnrollmentURL').modal('show');
}
});

Also, here is the code for "createModalWithData":

// Create a modal with a specific data context
// If modal template already exists, destroy
// and re-create with the new data context.
// If a location to render isn't specified, renders
// content in the body .
// Parameters: [Object] data { currentInstance : Template || null,
//                             template        : Template,
//                             dataToRender    : Object,
//                  (optional) location        : Element
// Return: Blaze Template Instance
createModalWithData = function createModalWithData(data) {

    // Ensure data exists
    if (_.isUndefined(data) || _.isNull(data)) {
        throw "data cannot be null or undefined";
    }

    // If modal already exists, destroy it
    if (!_.isNull(data.currentInstance)) {
        Blaze.remove(data.currentInstance);
    }

    // If location is undefined, set to page body
    if (_.isUndefined(data.location)) {
        data.location = document.body;
    }

    // Render modal with dataToRender
    return Blaze.renderWithData(data.template,
        data.dataToRender,
        data.location
    );
};

2) I attempt to retrieve the data using "Blaze.getData()" within my modal template

Template.Enrollment_Generator.onCreated(function() {
    var courseID = Blaze.getData().courseID; // Occasionally undefined

    Meteor.subscribe('enrollment-codes',courseID);
});

So far I've attempted to replace the "onCreated" method with "onRendered" but still had the same issue.

1

There are 1 answers

0
Joe On BEST ANSWER

It turns out the issue was within the click event. I had a nested span element within my share-course button:

<small class="share-course" data-courseid="{{_id}}">
     Share
     <span class="glyphicon glyphicon-share"></span>
</small>

This was messing up the way I was targeting my embedded courseID

Instead of Blaze.getData(), I should have also been using Template.currentData() to retrieve the data within my template

As stated here: https://forums.meteor.com/t/blaze-getdata-question/5688