Localisation Support in client-side data-* attributes

[Geetha]

     Hello All, I am actually usingl ocalization for displaying texts in Window title,

In the .resx file i have a text like  PopUpAjouter_Titre: Saisie d'une écriture .

In .cshtml file i am using this syntax to display the value

 @(Html.Kendo().ToolBar().Name("ToolBar").Resizable(false)
                                    .Items(items =>
                                    {
                                        items.Add().Type(CommandType.Button).Id("btnRefresh").SpriteCssClass("k-i-reload").ShowIcon(ShowIn.Both).HtmlAttributes(new { @title = Web.Resources.Views.TView.Action_Refresh, @class = "k-button-rond-ext" });
                                        items.Add().Type(CommandType.Separator).HtmlAttributes(new { @style = "border-color: rgba(0,0,0,0.08);" });
                                        items.Add().Type(CommandType.Button).Id("btnAjouter").SpriteCssClass("k-i-add").ShowIcon(ShowIn.Both).HtmlAttributes(new { @title = Web.Resources.Views.TView.Action_CreationEcritures, @class = "k-button-rond-ext",
                                            data_titre =  Web.Resources.Views.TView.PopUpAjouter_Titre)
                                        });

}))

when this page is rendered in the chrome browser the html tag is displayed like below

 

<a role="button" href="" tabindex="0" title="Création" class="k-button-rond-ext k-button k-button-icon" data-titre="Saisie d#39;une écriture" id="btnAjouter" data-uid="52af038a-512d-4456-bc78-1cd9cfe83fdd" data-overflow="auto" aria-disabled="false"><span class="k-sprite k-icon k-i-add"></span></a>

and the actual text is not displaye the singlequote or apostrophe is displayed as '

But when i display the same value in a Paragraph like,<p>@Web.Resources.Views.TView.PopUpAjouter_Titre</p>

 

it is displayed like this in the chrome browser, <p>Saisie d'une écriture de trésorerie</p>

If anyone has encountered this issue, please help me.

 

Regards,

NAIDU Geetha

[Petar]

Hi Geetha,

The reported behavior seems to be triggered by the way the Razor engine escapes the single quote symbol. Here are some approaches you can try to visualize the translation correctly with the apostrophe:

1. Try defining the PopUpAjouter_Titre variable as "Saisie d\'une écriture". Escape the single quote and see if the issue will sill appear.
2. Try defining the PopUpAjouter_Titre variable as "Saisie d&#39une écriture". The "&#39" is the way we can correctly espace the single quote. 

Let me know if the suggested above approaches help you resolve the issue.

Regards,
Petar
Progress Telerik