Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • mcgwest 23 posts 55 karma points
    Nov 13, 2009 @ 17:59
    mcgwest
    0

    Javascript In TinyMCE Editor

    Ok, what's the trick to allowing javascript code inside the TinyMCE editor in Umbraco?

    I've added the script tag as a valid element inside my tinymce config file, which initially appeared to work. However, tinymce wraps your javascript code in a CDATA block and I get the following error when I try to publish:

    Cannot have ']]>' inside an XML CDATA block.

    Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. 

    Exception Details: System.ArgumentException: Cannot have ']]>' inside an XML CDATA block.

    Is anyone using javscript with TinyMCE? How are you doing it?

    Thanks,

    -Todd

  • dandrayne 1138 posts 2262 karma points
    Nov 13, 2009 @ 19:32
    dandrayne
    0

    I created a macro with one parameter (textmultiline), then just display that with disable-output-escaping="yes"

    <xsl:value-of select="/macro/yourAlias" disable-ouput-escaping="yes" />

    Then it's a case of pressing insert macro, pasting in the script include and publishing.  (after turning off "render in editor")

    Dan

  • dunc85 39 posts 42 karma points
    Feb 05, 2010 @ 17:57
    dunc85
    0

    I can't get this to work.

     

    If the 'render in editor' box in unchecked, then I get a message saying "This macro does not provides rendering in WYSIWYG editor<\/span>"

    If the box is checked, then I get an error saying "Macro rendering contains script code
    This macro won\'t be rendered in the editor because it contains script code. It will render correct during runtime."

     

    In both cases nothing is inserted into the text editor and the dialog where I input the script stays on screen.

     

  • Dan 1285 posts 3917 karma points c-trib
    Feb 05, 2010 @ 18:01
    Dan
    0

    I don't think it's possible to render javascript in tinyMCE, but the macro should act as a placeholder to get your javascript into the web page upon publishing.

  • dunc85 39 posts 42 karma points
    Feb 08, 2010 @ 12:20
    dunc85
    0

    That's what I've tried, but the macro won't allow me to paste the Javascript in.

  • dandrayne 1138 posts 2262 karma points
    Feb 08, 2010 @ 12:34
    dandrayne
    0

    Make sure "render in editor" is disabled, then you should just see

    This macro does not provides rendering in WYSIWYG editor

    But when publishing you'll see the code output.  The macro will just be a textarea that you will be able to paste into.

    Dan

  • dunc85 39 posts 42 karma points
    Feb 08, 2010 @ 12:40
    dunc85
    0

    Hi,

     

    yes I get that message, but the popup box where i'm pasting the code remains on screen so i'm unable to publish. I have to cancel the popup which means the macro isn't inserted.

  • dandrayne 1138 posts 2262 karma points
    Feb 08, 2010 @ 12:51
    dandrayne
    0

    Poop, I just tried it and if there are script tags it won't insert.  Either this behaviour changed since Nov or I'm losing it.

    Simple fix is to wrap the script tags around your output within your xslt and not within the macro, so your macro would be something like

    <script type="text/javascript">
    <xsl:value-of
    select="/macro/yourAlias" disable-ouput-escaping="yes" />
    </script>

    And in the macro box you'd just paste e.g.

    alert("hiya");

    Dan

  • dunc85 39 posts 42 karma points
    Feb 08, 2010 @ 13:08
    dunc85
    0

    That works better, but it won't work if the code contains quotes. It seems they interfere with the other quotes in the macro.

    I've tried escaping them and encoding them (&quot;) but neither works.

     

    Single quotes work ok though.

  • dandrayne 1138 posts 2262 karma points
    Feb 08, 2010 @ 13:28
    dandrayne
    0

    umbraco.library:Replace() might help to overcome that, but g;ad you got it working somewhat.

  • Andrew Arnott 2 posts 24 karma points
    Oct 13, 2011 @ 17:52
    Andrew Arnott
    2

     These two steps worked for me. Step one is a config step, step two is a little hack in the TinyMCE javascript.

     

    1..\Website\config\tinyMceConfig.config

    a.       Add “,script[type|src|language]” (without the quotes, but with the starting comma) to the list of allowed tags. This should be on line 231, before the final ‘]]>’

    2.   ..\Website\umbraco_client\tinymce3\tiny_mce_src.js

    a.       Comment out “'script' : /]*>/gi,”, which should be on line 1983

    b.      This is part of the following block of code:

     

    attrRegExp = /([\w:\-]+)(?:\s*=\s*(?:(?:\"((?:\\.|[^\"])*)\")|(?:\'((?:\\.|[^\'])*)\')|([^>\s]+)))?/g;

                         specialElements = {

                    'script' : /]*>/gi,   

                           'style' : /]*>/gi,

                           'noscript' : /]*>/gi

     

                    In the function “processEndTag(name)”

     

     

    Step 1 tells TinyMCE that the script tag is to be considered valid and should not be removed.

    Step 2 prevents TinyMCE from trying to wrap javascript in CDATA tags, which cause nested CDATA errors.

  • Jose Blanco 12 posts 32 karma points
    Jun 08, 2012 @ 00:16
    Jose Blanco
    0

    I am having the same issue, I do not see 'script' : /]*>/gi, in the line 1983. I am trying to test your solutions Adrew I would appreciate your help. 

     


  • Andrew Arnott 2 posts 24 karma points
    Jun 08, 2012 @ 12:00
    Andrew Arnott
    0

    Are you able to find the block or the functionI mentioned, Jose?

     

    Line numbers might differ, but if that block is there, in the “processEndTag(name)” function, you should be in the right place.

  • Jose Blanco 12 posts 32 karma points
    Jun 08, 2012 @ 18:12
    Jose Blanco
    0

    yes, thanks a lot, now I am having troubles to reaload the changes in my site. I think that is something about client dependecy. 

  • Jose Blanco 12 posts 32 karma points
    Jun 08, 2012 @ 18:57
    Jose Blanco
    0

    I clear the browser cache. and now it is working, thanks a lot.

  • Pavel Gurecki 55 posts 158 karma points
    May 21, 2014 @ 17:01
    Pavel Gurecki
    0

    Hello,

    I have similar problem in Umbraco 6.1.3 MVC mode but Andrew's solution doesn't work unfortunately.

    I've created razor macro for inserting HTML/CSS/js code snippets to page in RTE. Macro has one text field where user should paste source code. If pasted code contains <script> tag, insertion fails and following error is shown in dialog bottom:

    "', 'Editor - Code Snippet', '

    Editor - Code Snippet<\/strong>
    No macro content available for WYSIWYG editing<\/span>

    '); });

    Any ideas how to make this work in MVC?

  • Pavel Gurecki 55 posts 158 karma points
    May 22, 2014 @ 09:42
    Pavel Gurecki
    0

    Found partial workaround for my issue:

    Before inserting source code with script tag to macro field, html encode it (with this for example). Then it works as intended because source code highlighter (js lib I use to style code) expects html encoded content. 

    But this is only workaround, it would be good to have better solution.

  • Amigo 243 posts 568 karma points
    Dec 11, 2015 @ 04:15
    Amigo
    0

    Just add this to config/tinyMceConfig.config -> validelements:

    ,script[type|src|language]

    just before: ]]>

  • Siavash Mortazavi 24 posts 145 karma points
    Oct 20, 2016 @ 18:49
    Siavash Mortazavi
    0

    Hi Amigo,

    Thanks, but it didn't work for me! I'm trying to insert a hubspot form script, but it gets removed by tinyMCE, as I save. Here is the code that I insert:

    <!--[if lte IE 8]> <script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script> <![endif]--> <script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script> <script> hbspt.forms.create({ sfdcCampaignId: '*', portalId: '*', formId: '*' }); </script>

  • Siavash Mortazavi 24 posts 145 karma points
    Oct 20, 2016 @ 19:29
    Siavash Mortazavi
    0

    Oh, I had to add '|charset' to it.

  • Amigo 243 posts 568 karma points
    Oct 23, 2016 @ 21:04
    Amigo
    0

    Hi Siavash,

    So did you get it working? what version are you using?

Please Sign in or register to post replies

Write your reply to:

Draft