Wednesday, February 06, 2008

Quick Tip on Including JavaScript files in Your Model-Glue Views

While programming with Model-Glue, I find that I have to often include JavaScript files in each individual view. I most often do this for form validation but it could be for whatever other reason. To keep things consistent, my project layout is based on the standard Model-Glue project layout with the editions of "css", "js" and "images":
  • trunk
    • config
    • controller
    • css
    • images
    • js
    • model
    • views

As you might have guessed, all my JavaScript files reside under "js". So until recently, I would include a JavaScript file as follows:

<script language="javascript" type="text/javascript">
<cfinclude template="../js/frmScanBadge.js" />

While this works, I do not like to have the hard coded path of the file. So instead, I settled on a solution that will get the name of the current view, look for a corresponding JavaScript file under the "js" directory and if finds one, it will include it:

<!--- If a JavaScript file exists with the name of the current template under the /js directory, include it --->
<cfif fileExists(expandPath("js/" & getFileFromPath(getCurrentTemplatePath()).replaceAll(".cfm", ".js")))>
<script language="javascript" type="text/javascript">
<cfinclude template="#'../js/' & getFileFromPath(getCurrentTemplatePath()).replaceAll('.cfm', '.js')#" />
This solution allows me to keep the name of the view and the corresponding JavaScript file the same. For new views, I can just drop a JavaScript file with the correct name in the "js" directory and it will be included in my view. Not insanely useful but nice non the less.
// //]]>