Question

Consider the following string if I need to localize it:

You need to write <b>@ViewBag.CharacterAmount</b> characters to be able to 
hand-in this homework. You're still missing <b id="charactersRemaining">
@ViewBag.CharacterAmount</b> characters to reach this limit.

What would be the best approach? Using string.Format is a bit complex, since ASP .NET MVC escapes HTML code, and besides, I’d rather be free of HTML code in my resource files. However, I still need to be able to refer to those values inside the b tags from JavaScript.

Any ideas? What is your approach to this when you do localization?

Answer 1

You could write a custom helper:

public static class ResourcesExtensions
{
    public static IHtmlString Resource(this HtmlHelper htmlHelper, string message, params object[] args)
    {
        var parameters = args.Select(x => htmlHelper.Encode(x)).ToArray();
        return new HtmlString(string.Format(message, parameters));
    }
}

As you can see the HTML helper encodes only the values. We have full control over the rest of the message because it is in the resources file and we suppose that it is valid HTML, so no problem with XSS.

and then have a resources file to your project which will contain for example the following key:

MyMessage = You need to write <b>{0}</b> characters to be able to hand-in this homework. You're still missing <b id="charactersRemaining">{1}</b> characters to reach this limit.

and then don’t forget to mark this resources file with the PublicResXFileCodeGenerator custom tool so that Visual Studio generates a public class that will allow you to access the properties in the view.

and finally in the view:

@Html.Resource(Resources.MyMessage, (int)ViewBag.CharacterAmount, (int)ViewBag.CharacterAmount)

The reason you need to cast is because extension method cannot dispatch dynamic arguments. But obviously that’s not a problem at all because you shouldn’t be using ViewBag/ViewData but you should be using view models and strongly typed view models so in your real code you will have:

@Html.Resource(Resources.MyMessage, Model.CharacterAmount, Model.CharacterAmount)

One downside with this approach is that we have moved some markup in the resources file which unfortunately might render the views a little less understandable and when we need to modify it, we should do this in all localized versions.

Another approach of course consists into putting in your resources file every distinct part of this markup and then:

@Resources.YouNeedToWrite <b>ViewBag.CharacterAmount</b> @Resources.StillMissing 
<b id="charactersRemaining">ViewBag.CharacterAmount</b> @(Resources.ToReachLimit).