kendo.culture("de-De") does not change culture

1 Answer 766 Views

Localization

Peter asked on 06 Sep 2021, 01:47 PM | edited on 06 Sep 2021, 01:47 PM

Hello,

I run into a problem I can't figure out what's wrong. I have a _layout with:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - I18n test</title>
    @{ var kendoVersion = "2021.1.119";}
    <link href="https://kendo.cdn.telerik.com/@kendoVersion/styles/kendo.common-material.min.css" rel="stylesheet" type="text/css" />
    <link href="https://kendo.cdn.telerik.com/@kendoVersion/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
    <link href="https://kendo.cdn.telerik.com/@kendoVersion/styles/kendo.material.min.css" rel="stylesheet" type="text/css" />
    <script src="https://kendo.cdn.telerik.com/@kendoVersion/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/@kendoVersion/js/jszip.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/@kendoVersion/js/kendo.all.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/@kendoVersion/js/kendo.aspnetmvc.min.js"></script>
    <script src="~/js/site.js" asp-append-version="true"></script>
    <script src="~/lib/kendo-ui/js/cultures/kendo.culture.de-De.min.js"></script>
    <link rel="stylesheet" href="~/css/site.css" />
</head>
<body>
    <script>
        kendo.culture("de-De");
        console.log("(1) should be de-DE: " + kendo.culture().name);
    </script>
    <div class="container">
        <main role="main" class="pb-3">
            @RenderBody()
        </main>
    </div>
    <footer class="border-top footer text-muted">
        <div class="container">
        </div>
    </footer>
    @RenderSection("Scripts", required: false)
</body>
</html>

The output on console is "... en-US".

The language file is stored in:

.........\wwwroot\lib\kendo-ui\js\cultures

06.09.2021  15:29             5.442 kendo.culture.de-DE.min.js
16.06.2021  03:22             8.112 kendo.culture.de-DE.min.js.map

But in the cshtml file this works:

            items.Add()
                .Field(f => f.DatumVon)
                .Editor(e => e.DatePicker()
                                .Culture("de-DE"))

The display of the names of month and everything works. If I remove the Culture() command, the DatePicker shows the US Style.

I tried this in serveral versions. Result allways the same.

Peter

1 Answer, 1 is accepted

Accepted

answered on 09 Sep 2021, 07:04 AM

Hi Peter,

When referencing the scripts you should capitalize the last letter "de-DE" instead of "de-De"

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - I18n test</title>
    @{ var kendoVersion = "2021.1.119";}
    <link href="https://kendo.cdn.telerik.com/@kendoVersion/styles/kendo.common-material.min.css" rel="stylesheet" type="text/css" />
    <link href="https://kendo.cdn.telerik.com/@kendoVersion/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
    <link href="https://kendo.cdn.telerik.com/@kendoVersion/styles/kendo.material.min.css" rel="stylesheet" type="text/css" />
    <script src="https://kendo.cdn.telerik.com/@kendoVersion/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/@kendoVersion/js/jszip.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/@kendoVersion/js/kendo.all.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/@kendoVersion/js/kendo.aspnetmvc.min.js"></script>
    <script src="~/js/site.js" asp-append-version="true"></script>
    <script src="~/lib/kendo-ui/js/cultures/kendo.culture.de-DE.min.js"></script>
    <link rel="stylesheet" href="~/css/site.css" />
</head>
<body>
    <script>
        kendo.culture("de-DE");
        console.log("(1) should be de-DE: " + kendo.culture().name);
    </script>
    <div class="container">
        <main role="main" class="pb-3">
            @RenderBody()
        </main>
    </div>
    <footer class="border-top footer text-muted">
        <div class="container">
        </div>
    </footer>
    @RenderSection("Scripts", required: false)
</body>
</html>

Give this suggestion a try and let me know if setting the culture works as expected.

Regards,
Aleksandar
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.

Peter

commented on 09 Sep 2021, 08:21 AM

Tomatos on the eyes...!

Strange pitfall. Cause the Microsoft API doesn't care about "de-De" or "de-DE". So we never had a problem with this :-) Now it works like a charm.

BTW: after fixing this, my boss orders licences. We're going into production with Kendo.UI. One of the reasons: Your great support.