// you’re reading...

Tricks

SmartEdit and Javascript


If you have Javascript in your website, and have implemented your Javascript files as templates in RedDot CMS (version 7.5), linked in to your HTML page via an anchor placeholder, you will most likely have come across this issue – your Javascript doesn’t work in SmartEdit!

The reason? RedDot CMS in SmartEdit mode does some mucking around with your template which causes Javascript errors. Take the simple Javascript template below:

function helloWorld() {
  alert("Hello World!");
}

In SmartEdit, this becomes:

<HTML><HEAD></HEAD>
<BODY ONLOAD="CheckAllTargets();" >
  <SCRIPT language="javascript" src="ioEditElement.js"></SCRIPT>
  <SCRIPT language=javascript src="RDCleanHtml.js"></SCRIPT>
  <SCRIPT language="javascript">
    sInvertDirectEdit="0";
    var sRemoveFontSettings="1";
    var sRemoveStyleSettings="1";
    var sAllowedStyleAttributes="";
  </SCRIPT>
  function helloWorld() {
    alert("Hello World!");
  }

As you might expect – this isn’t valid Javascript, and basically the Javascript processing stops at the top of the file. We can eliminate this with a single line of code to our original Javascript file:

<!IoRangeRedDotMode>
/* <body>RedDot decoy</body> */
<!/IoRangeRedDotMode>
  function helloWorld() {
    alert("Hello World!");
  }

Now, when RedDot CMS renders the Javascript in SmartEdit, it will be conveniently fooled by our decoy HTML body tags (as shown below) and all will be well!

<!IoRangeRedDotMode>
  /* <body ONLOAD="CheckAllTargets();" >
  <SCRIPT language="javascript" src="ioEditElement.js"></SCRIPT>
  <SCRIPT language=javascript src="RDCleanHtml.js"></SCRIPT>
  <SCRIPT language="javascript">
    var sInvertDirectEdit="0";
    var sRemoveFontSettings="";
    var sRemoveStyleSettings="";
    var sAllowedStyleAttributes="";
  </SCRIPT>RedDot decoy</body>
 */
<!/IoRangeRedDotMode>
  function helloWorld() {
    alert("Hello World!");
  }
Share and Enjoy:
  • Print
  • email
  • Twitter
  • Digg
  • Reddit
  • StumbleUpon
  • Google Bookmarks
  • del.icio.us
  • MisterWong
  • Facebook
  • LinkedIn

No related posts.

About the author:

Adrian Mateljan Adrian Mateljan lives in Reading, United Kingdom but is actually an Australian hailing from Perth, Western Australia. Currently contracting in London specialising in RedDot CMS.

Discussion

3 comments for “SmartEdit and Javascript”

  1. Much more simple:

    Append &script=1 to the end of the javascript anchor reference

    [script src="yourscript.js[!IoRangeRedDotMode]&Script=1[!/IoRangeRedDotMode]“][/script]

    Posted by Alex | September 22, 2008, 10:22 am
  2. With the &Script=1 solution you have to clear the cache everytime you change your script.
    So while you’re developing JS during a CMS setup phase I don’t prefer that, because the .js is stored first in den ImageCache of the RedDot CMS and second in your browser cache.
    So the way I do it is a bit tricky it’s a mix of anchor and container to avoid JS caching while page development. Maybe an article about that later.

    Posted by Markus Giesen | October 24, 2008, 11:17 am
  3. The suggested solution doesn’t seem to work with v9. Please advise.

    Posted by Calvin | April 20, 2010, 8:47 am

Post a comment



Stay up to date! - Get notified about followup comments

If you don't feel the urge to comment but wish to stay in the loop:
Just enter your email and subscribe to new comments.

Subscribe without commenting

Recent Tweets

  • RT @AirKraft: Transport Canada breakout: they manage 80K pages and 300K assets with WSM(RedDot). Wow! #OTCW 2010-11-11
  • The RedDot usergroup session 'Future of WCM' is in National Harbor 7, now. See you there! #otcw 2010-11-11
  • RT @yttergren: @AirKraft: Calling all WSM(RedDot) devs: share your solutions on http://bit.ly/bgPIof EVERY solution can win an iPad #OTCW 2010-11-10
  • Come to the Solution Exchange session. Enhance your (#reddot) CMS project! Chesapeake 12, 3:20pm #otcw Looking forward to see you there! 2010-11-10
  • More updates...