Link to home
Start Free TrialLog in
Avatar of rdogmartin
rdogmartinFlag for United States of America

asked on

How to escape or replace apostrophe and quotation mark in javascript variables?

I have an ASP.NET web page with javascript that manipulates variables that may contain apostrophes and quotation marks. As you might imagine, these characters are causing script errors because they are terminating the string. I tried escaping them with this function:

function escapeCharacters(str)
{
      str = str.replace(/""/g, '\\""');
      str = str.replace(/'/g, ""\\'"");
      return str;
}

This improves things but still causes issues in certain scenarios. (Specifically, the javascript within the ComponentArt Grid control's client templates do not seem to be respecting the escaped quotation mark.)

Is there a more reliable way to escape these characters? Or perhaps another approach is warranted - how about replacing the apostrophe and quotation mark with two benign characters that always play nice? But which characters? I need to round trip the values so I need to choose two characters that won't ever be legitimately present. This is an international application where a wide variety of languages may be present.
Avatar of Kin Fat SZE
Kin Fat SZE
Flag of Hong Kong image

try this
<script type="text/javascript">

function escapeCharacters(str)
{
      str = str.replace(/"/g, '\\\"').replace(/\'/g, "\\'");
      return str;
}
//document.write('abc"def\'xyz'+'<br/>');
document.write(escapeCharacters('abc"def\'xyz')+'<br/>');
</script>
Avatar of rdogmartin

ASKER

Unfortunately, that did not make any difference. I spent some time to reduce the issue down to the simplest scenario:

<p id="pTest"></p>
<script type="text/javascript">
    var roleName = 'role\"name';
    var roleNameEscaped = escapeCharacters(roleName);
    var str = '<a href="javascript:alert(\'' + roleNameEscaped + '\');">Test</a>';
   
    document.getElementById('pTest').innerHTML = str;
   
    function escapeCharacters(str)
    {
        str = str.replace(/"/g, '\\\"').replace(/\'/g, "\\'");
        return str;
    }
</script>

The script writes a hyperlink to the <p> tag that, when clicked, shows an alert displaying the contents of the roleName variable. When roleName contains a quotation mark, as shown above, the script fails.

I cannot figure out how to escape the quote inside the roleName variable so that the script works.

SOLUTION
Avatar of Kin Fat SZE
Kin Fat SZE
Flag of Hong Kong image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
ASKER CERTIFIED SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial