Search code examples
javascriptmodulerequirejsdynamics-crmmicrosoft-dynamics

Attaching modules to Microsoft Dynamics CRM Form Events


I am using Typescript to write custom code to handle form events. For each form, I have a separate file and then I combine the files at compile time into one file that I then use across all forms. I am having trouble attaching events to the form - I get an error that my function name can't be found. Below is one of the requirejs modules that is in the compiled Javascript file. I have tried connecting the events using Evaluation.[function], Forms/Evaluation.[function], and EvaluationScripts.[function] without any luck. What naming structure should I be using to attach my form events?

tsc compile

define("Forms/Evaluation", ["require", "exports", "Global/Helpers", "Global/CCSEQ", "Global/Sync", "Global/Util", "Global/Query"], function (require, exports, Helpers, CCSEQ, Sync_4, Util_10, Query) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var EvaluationScripts = (function (_super) {
__extends(EvaluationScripts, _super);
function EvaluationScripts() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.EmployeeStaffLevelAsOfDateQuery = //query;
return _this;
}
EvaluationScripts.prototype.onLoad = function () {

};
EvaluationScripts.prototype.onSave = function (execObj) {

};
EvaluationScripts.prototype.ccseq_employeeid_onChange = function () {

};

return EvaluationScripts;
}(Helpers.FormLibrary));
exports.Evaluation = new EvaluationScripts();
});

Update

I have tried to use Webpack to compile my modules as well, but I am still getting an error when I connect the onLoad function to the onLoad event. Below is an example of my Webpack-compiled file.

Webpack-Compile

var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;!(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__, exports, __webpack_require__(6)], __WEBPACK_AMD_DEFINE_RESULT__ = function (require, exports, EvaluationForm) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Evaluation = EvaluationForm;
}.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__),
                __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));


/***/ }),
/* 6 */
/***/ (function(module, exports, __webpack_require__) {

var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;!(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__, exports, __webpack_require__(7), __webpack_require__(1), __webpack_require__(4), __webpack_require__(0), __webpack_require__(3)], __WEBPACK_AMD_DEFINE_RESULT__ = function (require, exports, Helpers, CCSEQ, Sync_1, Util_1, Query) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var evaluationPeriodDate;
    var EmployeeStaffLevelAsOfDateQuery = xml;
    function onLoad() {

    }
    exports.onLoad = onLoad;
    function onSave(execObj) {

    }
    exports.onSave = onSave;
    function onCreate() {

    }
    exports.onCreate = onCreate;
    function ccseq_employeeid_onChange() {

    }
    exports.ccseq_employeeid_onChange = ccseq_employeeid_onChange;

}.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__),
                __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));

Solution

  • In the end, I ended up creating a new file that imported all of the Form files. This, along with rexkenley's suggestion allowed me to connect the form events successfully using CCSEQ.[FormName].

    Library.ts

    import {Test as TestForm} from './path/to/form';
    
    (<any>window).CCSEQ = {};
    
    (<any>window).CCSEQ.Test = TestForm;