Why is my class undefined at runtime. Javascript Module Template

When I run my application, I get: "Uncaught TypeError: Can't read property 'init' from undefined" Warning in document reasdy function is fired, so I know jQuery is loading at this point. But I don't know why Task is undefined.

This is an MVC5 app and running jQuery 1.10.2

Help, jsFiddle works great and JsHint shows no errors.

    var Task = (function () {

    var initialize = function () {
        console.log($);
        bindEvents();
    };
    var postFilter = function () {
        console.log("clicked");
        var postData = {
            UserID: $('#user_select').val,
            TaskTypeID: $('#taskTypeSelect').val,
            TaskStatusID: $('#status_select').val,
            PriorityID: $('#priority_select').val
        };

        $.ajax({
            url: "/Tasks/_AllTaskView",
            data: postData,
            success: function (response) {
                $('#results').html(response);
            }

        });
    };

    var bindEvents = function () {
        $('#submit_filter').on('click', postFilter);
    };

    return
    {
        init : initialize

    };

})();

$(document).ready(function () {
    alert()
    Task.init();
});

      

+3


source to share


2 answers


Place your curly braces return

on the same line as return

.

Instead:

return
{
    init : initialize

};

      



Do it:

return {
    init : initialize
};

      

JavaScript has auto-semicolon insertion which automatically completes the return statement before it gets caught in curly braces.

+6


source


Try this here:



return{ init : function(){
                 initialize();
               }
      }

      

0


source







All Articles