quote in javascript var

Question

I want to do something like this :

<script>
var text = "this is some sample text that i want to replace";
var new_text = text.replace(/'/g, "\\'");
var new_text = text.replace(/"/g, "\"");
document.write(new_text);
</script>

but as long as there is a " in my var text var text = "this is some sample "text" that I want to replace"; it breaks my javascript so that I cannot replace it.

My var text comes from a modx CMS tiny mce field so it is a kind of $ displayed like this [[*content]].

And this is my modx template code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> 
<head><meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>[[*titrepage]]</title>
<style type="text/css">
div.code_view {
    height:auto;
    }

div.code_demo {

    /* margin:1em auto 1.4em; */
    border:1px solid #ddd;
                width: 535px;
                color: #112433;

    }

div#content div.code_demo ul.demoLinks {
    margin:6px 6px 10px;
    }

div#infoDiv { 
   padding:0 8px 8px;
   }



div#infoDiv h4 {
    margin:4px 0;
    font-size:1.1em;
    }

</style>
<script src="http://aurorafilms.eskem-studio.com/assets/templates/aurora/js/dw_contentswap.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">

function init_ContentSwap() {
    var swap1 = {
        restoreDefault: false,
        content: {
            'old': "<h4>Synopsis</h4><p>[[*synopsis]]</p>",
            'infos': '<h4>Infos</h4><p>[[*infos]]</p>',
                                            'presse': "<h4>Presse</h4><p>[[*Presse:jsonEncode]]</p>",
            'festivals': "<h4>Festivals</h4><p>[[*festival]]</p>"


        }
    }

    dw_ContentSwap.setup(swap1);
}

dw_Event.add(window, 'load', init_ContentSwap);

</script></head>
<body>  
<div id="page">    <ul class="demoLinks">
        <li style="z-index: 10; width: 80px; position: relative; "><a href="#old" class="showInfo old">Synopsis</a></li>
        <li style="z-index: 9; width: 80px; position: relative;  left: -20px;"><a href="#infos" class="showInfo infos">Infos</a></li>
        <li style="z-index: 8; width: 80px; position: relative;  left: -40px;"><a href="#presse" class="showInfo presse">Presse</a></li>
        <li style="z-index: 7; width: 80px; position: relative;  left: -60px;"><a href="#festivals" class="showInfo festivals">Festivals</a></li>

    </ul><div id="content" style="float: left;" >
            <div id="text">
<!-- demo -->

<div class="code_demo">


    <div id="infoDiv"><h4>Synopsis</h4><p>[[*synopsis]]</p></div>
</div>


<!-- end demo -->

<p class="clearer">&nbsp;</p></div> </div>  </div>    



</body>
</html>

So what is the best way to do this?

Your question isn't clear. Isn't the problem in the insertion of the text in your script ? — Denys Séguret, Jan 18 '13 at 11:48
If the source code is broken, it cannot be executed. Quotes must be escaped in the source code, you cannot do that programmatically. — Felix Kling, Jan 18 '13 at 11:48
you could write a simple [output filter](http://rtfm.modx.com/display/revolution20/Input+and+Output+Filters+(Output+Modifiers)) which would format the given string to be js-compatible. — Yoshi, Jan 18 '13 at 11:49

score 1 · Accepted Answer · edited May 23 '17 at 12:27

1

The problem is, that you're trying to use the content from your resource as a javascript string (injected by the modx parser). But hardcoded strings in javascript must follow some rules (no or only escaped newlines, proper quoting). So simply putting some quotes around it will only help in the simplest cases.

To fix your problem, try the following:

1. create a new snippet, called jsonEncode with the following content:

<?php
return json_encode($input);

2. change the javascript code, where you want to use your resource-content to something like:

var text = [[*content:jsonEncode]];

Links:

update

Seeing the added code, I'd suggest a different approach. As what I described above will probably break if you're using nested modx-variables. I think the savest way would be to render whatever content you need accessible in js into a hidden div. And extract the innerHTML from that element.

edited May 23 '17 at 12:27

Community

1
1

answered Jan 18 '13 at 12:14

Yoshi

54,081
14
89
103

It is almost what i need but there is no addslashes before ", my javascript string looks like this :`'presse': "
Presse
"France \/ Maroc \/ Allemagne - 2011
105 minutes - DCP \/ 35mm - couleur - 1.85

"
",` – Sylvain Le Bihan Jan 18 '13 at 12:49
Could you add the real code you use in your template/chunk to the question? I don't think addslashes is necessary as `json_encode` should handle this. – Yoshi Jan 18 '13 at 12:52
ok i put the full code of my template in the question.. Thank you very much you are very helpful... – Sylvain Le Bihan Jan 18 '13 at 12:56
That's quite some code, is it the js function `init_ContentSwap`? – Yoshi Jan 18 '13 at 13:12
yes, ho sorry i can clear the code if you want me to... yes function init_ContentSwap() { is the js function – Sylvain Le Bihan Jan 18 '13 at 13:32
@user1758935 You could, to clear up the question a bit, but read my update before that. ;) – Yoshi Jan 18 '13 at 13:33
Ok so for example i display [[*synopsis]] in a hidden div and then i extract the innerHTML from this div to display in javascript. No idea how to do that ~ document.getElementById("mydivid").getElementsByTagName('div')[0].innerHTML – Sylvain Le Bihan Jan 18 '13 at 14:23
@user1758935 give that div an `id` (e.g. `synopsis`) and access it like: `document.getElementById('synopsis').innerHTML`. Be careful though, code like this should only be run when the dom is ready to be accessed. – Yoshi Jan 18 '13 at 14:28
` – Sylvain Le Bihan Jan 18 '13 at 14:31
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/22980/discussion-between-yoshi-and-user1758935) – Yoshi Jan 18 '13 at 14:32

score 0 · Answer 2 · answered Jan 18 '13 at 12:13

0

Try:

<script>
var text = "this is some sample text that i want to replace";
var new_text = new_text.replace(/["']/g, "'")
document.write(new_text);
</script>

answered Jan 18 '13 at 12:13

Sablefoste

4,032
3
37
58

quote in javascript var

2 Answers2

Presse