1
votes

What does the error "Failed to load routed module (edit/user/index). Details: undefined is not a function" mean?

I get this error intermittetly and my stack trace looks like this:

logError system.js?bust=1398976887311:92
(anonymous function) router.js?bust=1398976887311:362
l jquery.min.js:6
c.fireWith jquery.min.js:6
(anonymous function) jquery.min.js:6
l jquery.min.js:6
c.fireWith jquery.min.js:6
i.(anonymous function) jquery.min.js:6
(anonymous function) system.js?bust=1398976887311:260
(anonymous function) require.js:129
(anonymous function) require.js:1154
each require.js:57
Module.emit require.js:1153
(anonymous function) require.js:529
each require.js:57
onError require.js:522
Module.check require.js:893
(anonymous function) require.js:1111
(anonymous function) require.js:129
(anonymous function) require.js:1154
each require.js:57
Module.emit require.js:1153
Module.check require.js:924
Module.enable require.js:1141
Module.init require.js:778
callGetModule require.js:1168
context.completeLoad require.js:1530
context.onScriptLoad

I have a module global that looks like this:

    define(['jquery', 'knockout', 'plugins/ajax'], function ($, ko,ajax) {
    'use strict';

    var obj = {};


    obj.loading = ko.observable(false);
    obj.activate = function () {

        obj.loading.subscribe(function (newValue) {
            if (newValue) {
                $.blockUI({
                    css: {
                        border: 'none',
                        padding: '15px',
                        backgroundColor: '#333',
                        '-webkit-border-radius': '10px',
                        '-moz-border-radius': '10px',
                        opacity: 0.9,
                        color: '#fff',
                        fontSize: '26px',
                        fontFamily: "'Helvetica Neue', Helvetica"
                    },
                    overlayCSS: {
                        opacity: 0.2,
                    },
                    message: '<span>Please wait...</span>',
                    fadeIn: 0
                });
            }
            else
                $.unblockUI();
        });

        obj.promise = $.when(
                   ajax.wrap('Durandal/GetUnitModel', { Id: '1' }, function (response) {
                       ajax.updateModel(obj, 'unitModel', response.Model);
                   }),
                   ajax.wrap('Durandal/GetUserModel', { Id: '1' }, function (response) {
                       ajax.updateModel(obj, 'userModel', response.Model);
                   }),
                   ajax.wrap('Durandal/GetOfficeModels', { Id: '1' }, function (response) {
                       ajax.updateModel(obj, 'Offices', response.Model);
                   }),
                   ajax.wrap('Durandal/GetUserGroupModels', { Id: '1' }, function (response) {
                       ajax.updateModel(obj, 'UserGroups', response.Model);
                   })
               );

        return obj.promise;

    };

    return obj;
});

My edit user module that intermittently doesn't load (half the time it works fine) is:

define(['durandal/global','plugins/router', 'plugins/http', 'durandal/app', 'knockout', 'plugins/ajax', 'plugins/dialog', 'plugins/permissions', 'plugins/utility'], function (global,router, http, app, ko, ajax, dialog, permissions,utility) {

    var vm = {};
    vm.permissions = permissions;
    vm.utility = utility;
    vm.global = global;
    vm.AddOffices = ko.computed(function () {
        var ao = [];
        $.each(global.Offices(), function (i, v) {
            if (v.Name() != 'N/A' && v.Name() != 'Office of Afghanistan and Pakistan Affairs')
                ao.push(v);
        });

        return ao;
    });

    vm.getUser = function (personId) {

        if (personId == '0') {
            return $.when(global.promise).then(function () {

                ajax.updateModel(vm, 'newPersonRecord', {
                    "Email": ko.observable(""),
                    "FirstName": ko.observable(""),
                    "LastName": ko.observable(""),
                    "UserGroup": { Id: ko.observable("3"), Name: ko.observable("Viewer") },
                    "UserGroupId": ko.observable("3"),
                    "Office": { Id: ko.observable(global.Offices()[0].Id()), Name: ko.observable(global.Offices()[0].Name()) },
                    "OfficeId": ko.observable(global.Offices()[0].Id()),
                    "CotrExpirationDate": ko.observable(""),
                    "UserExpirationDate": ko.observable(Date.today().add(6).months().add(-1).days().toString('M/d/yyyy')),
                    "Id": ko.observable("0"),
                    "UnitId": global.userModel.UnitId(),
                    "UnitName": global.userModel.UnitName(),
                    "PasswordResetDate": ko.observable(""),
                    "Name": ko.observable(""),
                    "UserGroupName": ko.observable(""),
                    "OfficeName": ko.observable("")
                });
            });

                }
                else
                    return ajax.wrap('UserAdmin/GetUser', { PersonId: personId }, function (response) {
                        ajax.updateModel(vm, 'newPersonRecord', response.Model);
                    });   
    };

    vm.activate = function (personId) {

        return vm.getUser(personId);
    };
    vm.save = function () {
        if ($("[name='validationError']:visible").length > 0) {
            alert('Please correct all errors before continuing.');
            return;
        }
        else {
            if (vm.newPersonRecord.OfficeId() != '40')
                ajax.wrap("UserAdmin/Update", vm.newPersonRecord, function (response) { if (!response.Success) alert(response.Message); else alert('User record saved.'); vm.back();});
            else
                ajax.wrap("UserAdmin/UpdatePartner", vm.newPersonRecord, function (response) { if (!response.Success) alert(response.Message); else alert('User recrord saved.'); vm.back(); });
        }
    };



    vm.back = function () {
        router.navigateBack();
    };




    vm.chars = function (str, numChars) {
        if (str.length > numChars)
            return false;

        return true;
    };

    vm.validEmail = function () {
        if (vm.newPersonRecord.Name().indexOf("@") == -1)
            return false;
        if (vm.newPersonRecord.Name().indexOf("’") != -1)
            return false;
        if (vm.newPersonRecord.Name().indexOf(",") != -1)
            return false;
        if (vm.newPersonRecord.Name().length < 4)
            return false;

        return true;
    };


    vm.emailExists = function () {
        var emailExists = false;

        $.each(viewModel.People(), function (index, value) {
            if (value.Name() == newPersonRecord.Name())
                emailExists = true;
        });

        return emailExists;

    };
    vm.cacheViews = false;

    return vm;
}); 

My shells.js module looks like this:

define(['plugins/router', 'durandal/app', 'plugins/ajax', 'durandal/global', 'durandal/activator'], function (router, app, ajax, global, activator) {

    var vm = {};

    vm.global = activator.create();
    //call this to refresh menu items
    vm.rebuildRouter = function () {
        return ajax.wrap('Durandal/GetMenuItems', { menuName:'viewmodels/shell.js' }, function (response) { 
                vm.router.deactivate();
                vm.router.reset();
                vm.router.routes = [];
                vm.router.map(response.Model).buildNavigationModel();
                vm.router.activate();
            });
        /* { route: 'Map*details', title: 'Map', moduleId: 'map/index', nav: true, hash: '#Map' },*/

    };

    vm.activate = function () {
        var promise = vm.global.activateItem(global);

        return $.when(promise, vm.rebuildRouter());
    }

    vm.refreshUnit = function () {

        ajax.wrap('PostLogin/DurandalSwitchUnit', { unitId: vm.global().userModel.UnitId() }, function (response) { $.when(global.activate(),vm.activate()).then(function () { router.navigate();}); });

    };

    vm.router = router;

    return vm;
});

Any help debugging this would be greatly appreciated. Has anyone else run into such an error, what did it mean? It would help to even know roughly where to look, why does Durandal throw this error, it says something is 'undefined' but what is it looking for that is undefined in this case?

2
I am having difficulty posting a simpler full js fiddle example of this because my module needs data from the server to proceed beyond activate, and has so many dependencies that I cannot easily post a full simple example. This code is in a subrouter and loads within a few nested composes. I would greatly appreciate if someone could help me anyway or give suggestions how to debug.pilavdzice

2 Answers

0
votes

Assuming you're using Durandal 2.x, change the following line in your module global:

define(['jquery', 'knockout', 'plugins/ajax'], function ($, ko,ajax) {...

to this:

define(['knockout', 'plugins/ajax'], function (ko,ajax) {...

See if that that solves the problem.

0
votes

This error message led me down hours of wild goose chases.

Eventually I found and fixed an error in my code where I had attempted to use the underscore library and this is what was failing.

If you get this error message, anything could be wrong anywhere in your module. You probably put a symbol like _ or $ somewhere in your code and it isn't defined.