While using "Custom Javascript"
area in Web pages, Web Form Steps etc. I found it a little bit uncomfortable in
use.
The max length of 10 000 characters not always enough and if I add a compiled content then debugging is blocked.
I ended up creating dynamic script loader. It picks up a url (like "~/Areas/FolderName/scriptName.min.js") from “Custom Javascript" area. Then script checks if such a namespace exists and object is loaded. If necessary, it loads the script.
The idea is very simple.
Have an object loaded with master page to load JavaScript and CSS files:
Unfortunately, looks like Adx already closed the “Ideas” area in the community forum but Microsoft haven’t opened one yet J
The max length of 10 000 characters not always enough and if I add a compiled content then debugging is blocked.
I ended up creating dynamic script loader. It picks up a url (like "~/Areas/FolderName/scriptName.min.js") from “Custom Javascript" area. Then script checks if such a namespace exists and object is loaded. If necessary, it loads the script.
The idea is very simple.
Have an object loaded with master page to load JavaScript and CSS files:
if (typeof (gHelper) == "undefined")
{ gHelper = { __namespace: true }; }
gHelper.data = {
addedFiles: "",
}
gHelper.fn = (function (window, document) {
function loadfile(filepath, filetype) {
var fileref;
// JavaScript file from solution
if (filetype == "js") {
fileref = document.createElement('script');
fileref.setAttribute("type", "text/javascript");
fileref.setAttribute("src", filepath);
}
// CSS file from solution
else if (filetype == "css") {
fileref = document.createElement("link");
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", filepath);
}
if (typeof fileref != "undefined")
document.getElementsByTagName("head")[0].appendChild(fileref);
}
return {
//load js or css file dynamicly
LoadFileDynamicly: function (filepath, filetype) {
if (gHelper.data.addedFiles.indexOf("[" + filepath + "]") == -1) {
loadfile(filepath, filetype);
gHelper.data.addedFiles += "[" + filepath + "]";
}
else {
alert("file already added!");
}
},
}
})(window, document);
The follow code supposed to be set up in “Custom
Javascript" area of WebPage, WebFormStep or wherever you need upload a js
library. if (typeof (gHelper) == "undefined")
{ gHelper = { __namespace: true }; }
gHelper.data = {
addedFiles: "",
}
if (window.jQuery) {
$(document).ready(function () {
if (typeof (gHelper) == "undefined") {
alert("Script error: Cannot find dynamic loader.");
return;
}
//add file or files you need to upload
gHelper.fn.LoadFileDynamicly("~/FolderName/ScriptFileName .js", "js");
});
}
It would be very nice from Adx to add a simple text field that could hold a JavaScript file url to load it in the Web page, Web Form Steps etc., like "Rewrite Url" in the Page Template. I
thought it might be a good option to have an alternative to “Custom
Javascript" area in the Adxstudio Crm solution.
Unfortunately, looks like Adx already closed the “Ideas” area in the community forum but Microsoft haven’t opened one yet J
Comments
And it's very true about Master Page. I use to created my own Master Pages, inherited from Adx Masters, for custom development. It helps keep the portal clean and updatable.