ToolBar buttons with french accents or ampersand don't display correctly

1 Answer 76 Views
Button Toolbar
Stéphane
Top achievements
Rank 1
Stéphane asked on 25 Apr 2023, 08:43 PM

I have an application with a Kendo MVC ToolBar including buttons with french text or including ampersands such as "R&D". 

This used to display correctly as "R&D" but since a recent update of the Telerik MVC controls, it displays encoded as "R&D".
If there is an apostrophe, a text like "En attente d'approbation" will show as "En attente d'approbation".

I can reproduce this problem in your demos, for example see:

Kendo UI demo
https://dojo.telerik.com/ErEXiBul

Telerik MVC demo
https://dojo.telerik.com/egulokat

Is there any way to get this to display as expected? I tried different things but it always show up with &amp text on the screen which is bad.

Thank you!

 

1 Answer, 1 is accepted

Sort by
0
Accepted
Martin
Telerik team
answered on 28 Apr 2023, 10:38 AM

Hi, Stéphane

You can add encoded:false to the item:

buttons: [
        { text: "En attente d'approbation", encoded:false },
        { text: "bar" },
        { text: "baz" }
      ]

Here is the modified example for reference.

Let me know how that works for you.

Regards,
Martin
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Stéphane
Top achievements
Rank 1
commented on 28 Apr 2023, 02:53 PM

Thank you for the answer. I confirm it works but my code uses a MVC ToolBar and I can't find the Encoded() method for that.

Is it also available for MVC? 
I see there is a forum post related to this here: https://www.telerik.com/forums/use-font-awesome-icons

To give another example of what I try to do:

@(Html.Kendo().ToolBar() .Name("ToolBar") .Items(items => { items.Add().Type(CommandType.ButtonGroup).Buttons(buttons =>
{
buttons.Add().Text("R&D").Id(123); // Encoded?
buttons.Add().Text("Another btn").Id(456);

});
})
)


 

Anton Mironov
Telerik team
commented on 03 May 2023, 11:12 AM

Hi Stéphane,

My name is Anton and I am a member of the Telerik UI for ASP.NET MVC & Core Team.

I tried the described scenario on my side and the result is the expected one when using an MVC application.

The code:

@(Html.Kendo().ToolBar()
    .Name("ToolBar")
    .Items(items => {
        items.Add().Type(CommandType.Button).Text("R&D");
        items.Add().Type(CommandType.Button).Text("To'ggle Button").Togglable(true);
    })
)

The result:

Attached is a sample project that I prepared for the case. It implements the approach above.

Feel free to build it, add the needed references, and let me know if this is the desired result.


Kind Regards,
Anton Mironov

 

Stéphane
Top achievements
Rank 1
commented on 03 May 2023, 03:33 PM

Your example works correctly. However my question was for the ButtonGroup with MVC. 

I just tested again with the latest version 2023.1.425 and it works correctly. It was not working with version 2023.1.117.

It looks like you just fixed that issue. So I will mark this as answered and just upgrade the controls. Thanks!

 In the release notes of 2023.1.425:

ButtonGroup

FIXED
  • Encoded does not work as expected in ButtonGroup (7310)
  • The selectedIndices property of the ButtonGroup returns incorrect indices. (7241)

https://github.com/telerik/kendo-ui-core/issues/7310

Bug report

The text in the ButtonGroup items is not encoded properly.

Anton Mironov
Telerik team
commented on 03 May 2023, 04:50 PM

Hi Stéphane,

I am glad to hear that the described issue is now resolved. Thank you for sharing the complete scenario and the bugfix for the case.

If further information or assistance is needed, do not hesitate to contact me and the team.

Best Regards,
Anton Mironov

Tags
Button Toolbar
Asked by
Stéphane
Top achievements
Rank 1
Answers by
Martin
Telerik team
Share this question
or