Adding JavaScript without creating a new template

Dave Nelson asked on September 19, 2018 18:00

I have 251 calculators to add to my website, each with its own page. Each calculator page will share a pair of common CSS files, and a common JS file, but they also need to include 2 unique JS files that are specific to that calculator.

I would prefer to not have 251 ad-hoc pages/templates, what is the best way to add the unique JavaScript files?

javascript template ad-hoc

Correct Answer

Zach Perry answered on September 19, 2018 18:04

Any template you want to keep should never be an ad-hoc template.

I would name your js files based off the document name. Then all the templates have the same web parts, and you just use one to add the js with the macro {%CurrentDocument.DocumentName|(identity)GlobalAdministrator%} as part of the path.

1 votesVote for this answer Unmark Correct answer

Recent Answers

Peter Mogilnitski answered on September 19, 2018 21:34 (last edited on December 10, 2019 02:31)

Managing 250+ files seems like quite a task. I would create route or use querystring parameters, i.e. your page is accessible /mypath/1 or /mypath?item=1. Add javascript and css web parts. Use macro to create a path to load appropriate file. i.e. for example CSS stylesheet file path would be something like /css/calc{%QueryString.GetValue("item","")|(identity)GlobalAdministrator%}.css

P.S. Is there lots of differences between these files i.e. calc1.js and calc2.js ? You can probably create a custom web part that will output

0 votesVote for this answer Mark as a Correct answer

Dave Nelson answered on October 16, 2018 14:47

Turns out using the Document Name did not work for this project as the document name is also used in breadcrumbs and the site map.

Instead I created a new field for the CMS.MenuItem page type named "CalculatorFileName" which I feel gives us the greatest amount of flexibility.

Is there any reasons I should not add new fields and use them in this way?

Could it make upgrading to newer versions of Kentico more difficult in the future?

0 votesVote for this answer Mark as a Correct answer

Peter Mogilnitski answered on October 16, 2018 15:12 (last edited on December 10, 2019 02:31)

That means you have to create 250 pages(menu items) with "CalculatorFileName" field. I am saying you have to have one page with parameters that will load appropriate calculator based on these parameters. If you can follow the convention then load:

/mypage?item=1 load calc1.js, calc1.css
/mypage?item=2 load calc2.js, calc2.css
/mypage?item=3 load calc3.js, calc3.css

... that essentially translate in to load calc{%QueryString["item"]|(identity)GlobalAdministrator%}.css for all you 250 files.

If for some reason the files name are not following anyconvention i.e. you have mycalc.js supercalc.js, somecalc.js etc you can put all these in custom table with the fields itemid, jsfilename, cssfilename. Again using macro you can query you custom table get the filenames from there. Custom table gives you the ability to search, manage files. You can list items from custom table etc using repeater etc. In my opinion it is a much better approach then 250 pages. The bottom line is: one page, one template, one place to manage files.

If you want to create 250 pages - I would create a new page type for calculator pages. You can inherit from menuitem if you want to (in this case it will get all fields what menu item has).

0 votesVote for this answer Mark as a Correct answer