Showing text from resources.resx in JavaScript

Question

This is example code in ASP.NET MVC 3 Razor:

@section header
{
    <script type="text/javascript">    
        $(function() {
            alert('@Resources.ExampleCompany');
        });
    </script>
}

<div>
    <h1>@Resources.ExampleCompany</h1>
</div>

The code above this is just an example, but it also shows my problem with encoding. This variable @Resources.ExampleCompany is a file resources.resx with value ExampleCompany = "Twoja firma / Twój biznes"

In JavaScript, the alert shows the "Twoja firma / Twój biznes".

Why is character 'ó' '&#243'? What am I doing wrong?

In HTML tag, <h1>@Resources.ExampleCompany</h1> is displayed correctly.

UPDATE:

Mark Schultheiss wrote a good hint and my "ugly solution" is:

var companySample = "@Resources.ExampleCompany";
$('#temp').append(companySample);
alert($('#temp').text());

Now the character is ó and looks good, but this is still not answer to my issue.

If you have apostrophes in the Resources text see: http://stackoverflow.com/a/11650077/878612 — lko, Oct 25 '13 at 07:22

score 21 · Accepted Answer · edited May 23 '17 at 12:15

21

According to HTML Encoding Strings - ASP.NET Web Forms VS Razor View Engine, the @ syntax automatically HTML encodes and the solution is to use the Raw extension-method (e.g., @Html.Raw(Resources.ExampleCompany)) to decode the HTML. Try that and let us know if that works.

edited May 23 '17 at 12:15

Community

1
1

answered Feb 08 '12 at 13:21

pete

24,141
4
37
51

Unfortunately function unescape did not help. Maybe this infofmation can help to resolve my problem - only one letter is encoded that 'ó', javascript code is in a file with html markup. If @Resources.ExampleCompany is written in markup then my char 'ó' is displayed correctly, but if in written in javascript - is not corectly. I don't know where looking mistake, maybe Razor has a bug? – stitch7c0 Feb 08 '12 at 14:12
Updated to try for server-side. – pete Feb 08 '12 at 14:23
Is the page output specified as UTF-8 in the headers? – pete Feb 08 '12 at 15:37
Not, but files is encode in UTF-8 and browers use correclty encoding (UTF-8). This is default mvc3 project, i did't change encoding setting – stitch7c0 Feb 08 '12 at 15:58
Updated answer. Please try this and let us know if it works for you. – pete Feb 08 '12 at 16:12
Thanks for that answer. Yes, this is what I need. Now the character shows up correctly. The finall code is: `$('#Company').example('@Html.Raw(Resources.ExampleCompany)');`. Thanks again. – stitch7c0 Feb 08 '12 at 18:41

Bronek · Answer 2 · 2014-01-30T22:23:18.670

I use following trick:

<script type="text/javascript">
    $('<div/>').html("@Resources.ExampleCompany").text();
</script>

Maybe it will help.

UPDATE

I have tested this behavior of Razor more thoroughly and I've found that:

1.When the text is put as normal content of html then @Html.Raw method simply helps and writes char 'ó' without html encoding (not as: ó)

example:

<div> @Html.Raw("ó") </div>

example:

<script type="text/javascript">
    var a = $('<div/>').html('@("ó")').text();// or var a =  '@Html.Raw("ó")';
    console.log(a); // it shows: ó
</script>

2.But if it is put inside html tags as attribute then Razor converts it to: ó and @Html.Raw doesn't help at all

example:

<meta name="description" content="@("ó")" />

Yo can fix it by putting the entire tag to Resource (as in that post) or to string (as in my example)

@("<meta name="description" content="ó" />")

So, sometimes somebody could have been little confused that the answers helps the others but not him.

score 1 · Answer 3 · answered Mar 15 '16 at 07:31

I had similar issue, but in my case I was assigning a value from Resource to javascript variable. There was the same problem with letter ó encoding. Afterwards this variable was binded to a html object (precisely speaking by knockout binding). In my situation below code give a trick:

var label = '@Html.Raw(Resource.ResourceName)';

score 1 · Answer 4 · edited Jun 11 '12 at 11:52

Some of this depends upon WHAT you do with the text.

For example, using the tags:

<div id='result'>empty</div>

<div id='other'>other</div>

And code (since you are using jQuery):

var whatitis="Twoja firma / Tw&#243;j biznes";
var whatitisnow = unescape(whatitis);
alert(whatitis);
alert(whatitisnow);
$('#result').append(whatitis+" changed to:"+whatitisnow);
$('#other').text(whatitis+" changed to:"+whatitisnow);

In the browser, the "result" tag shows both correctly (as you desire) whereas the "other" shows it with the escaped character. And BOTH alerts show it with the escaped character.

See here for example: http://jsfiddle.net/MarkSchultheiss/uJtw3/.

Showing text from resources.resx in JavaScript

4 Answers4