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" />
</script>

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')#" />
</script>
</cfif>
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.
No votes yet

Comments

Jim Priest replied on Wed, 2008/02/06 - 12:19pm

Great idea! I'm using jQuery more and more - and struggling with the best way to include my scripts in my MVC projects.

 Only problem I see with this is often times I'll have common file names in each view - ie: dspEdit.cfm  ...

 

 

Boyan Kostadinov replied on Wed, 2008/02/06 - 12:29pm in response to: thecrumb

Interesting point."getCurrentTemplatePath" gets the full physical path of the view such as "dspEdit.cfm" but I am not sure what would happen if you have multiple views. I should test that out.
------------------
Boyan Kostadinov
Blog: http://blog.tech-cats.com
Resume: http://boyan.tech-cats.com/resume
Portfolio: http://boyan.tech-cats.com/portfolio

Jim Priest replied on Wed, 2008/02/06 - 1:15pm in response to: boyan

If it was an issue - you could  maybe grab the parent directory and use that in your filename as well?

js/dir1-dspEdit.js

js/dir2-dspEdit.js 

 

dir1/dspEdit.cfm

dir2/dspEdit.cfm 

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.