Base solution for your next web application
Open Closed

Localization of javascript files #1995


User avatar
0
eu11111 created

I am working with jqueryvalidation library and it has localization files for each country/language combination. I would like to know the best way to work with bundling of localized files.

Can I inject localization manager inside BundleConfig class and localize the file name there?


6 Answer(s)
  • User Avatar
    0
    ismcagdas created
    Support Team

    You can use Thread.CurrentThread.CurrentUICulture.Name.

  • User Avatar
    0
    eu11111 created

    Thanks for the answer.

    But I can't do it in the bundler, can I? I tried adding like this, but it didn't work!

    bundles.Add(
        new ScriptBundle("~/Bundles/pages/vendor/js")
              .Include("~/Dashboard/assets/plugins/jquery-validation/js/localization/messages_" + Thread.CurrentThread.CurrentUICulture.Name.Replace("-", "_") + ".js")
                    );
    
  • User Avatar
    0
    hikalkan created
    Support Team

    Hi,

    You can not (should not) include localized files to bundles. Because bundle is created one time, but different users will have different languages (it's not created per user). This is nature of bundling.

    Actually, we did the same for jquery validation library in AspNet Zero: <a class="postlink" href="https://github.com/aspnetzero/aspnet-zero/blob/dev/src/MyCompanyName.AbpZeroTemplate.Web/Areas/Mpa/Views/Layout/_Layout.cshtml#L95">https://github.com/aspnetzero/aspnet-ze ... cshtml#L95</a> So, you can directly use it. If you want to know implementation, see ScriptPaths class.

  • User Avatar
    0
    eu11111 created

    Thanks, hikalkan!

    I can't access your link since it is probably private, but I found a workaround. I am loading different localized bundles and then I import the bundle based on the culture name of the user.

  • User Avatar
    0
    hikalkan created
    Support Team

    Creating bundle per language is a good solution, but we didn't make it thinking there may be many languages that makes many bundles. Anyway, this is a good solution.

  • User Avatar
    0
    eu11111 created

    If anyone is interested on a quite clean solution:

    I create several bundles that adds the localized scripts. Example:

    ~/Scripts/Localized/en will include ~/Scripts/jquery-validation/js/localization/messages_en.js ~/Scripts/Localized/pt-BR will include ~/Scripts/jquery-validation/js/localization/messages_pt-BR.js

    foreach (var cultureName in listLangCultures)
                {
                    bundles.Add(
                        new ScriptBundle(string.Format("~/Scripts/Localized/{0}", cultureName))
                            .Include(
                                string.Format(
                                    "~/Scripts/jquery-validation/js/localization/messages_{0}.js",
                                    cultureName)));
                }
    

    The class that renders the localized scripts

    public class LocalizedScripts
        {
            public static HtmlString Render(string fileName, string culture, string delimiter)
            {
                fileName = string.Concat(fileName, delimiter, culture);
                var output = (HtmlString)Scripts.Render(fileName);
                return output;
            }
    
            public static HtmlString Render(string fileName, string culture)
            {
                return Render(fileName, culture, "/");
            }
    
            public static HtmlString Render(string fileName)
            {
                return Render(fileName, Thread.CurrentThread.CurrentUICulture.Name, "/");
            }
        }
    

    Usage examples (used in Layout file, ie)

    @LocalizedScripts.Render("~/Scripts/Localized");  // will load ~/Scripts/Localized/[current culture based on thread]
    @LocalizedScripts.Render("~/Scripts/Localized", "en");  // will load ~/Scripts/Localized/en
    @LocalizedScripts.Render("~/Scripts/Localized", "en", "-"); // will load ~/Scripts/Localized-en
    

    I am not sure if this is the best solution, but it was the easiest/cleanest I could find. It works like a charm. I also suggest implementing something like PermissionNames in the Core layer, but to have a List of all ApplicationLanguage of your application. This way you can also use it on DefaultLanguagesCreator method in DefaultLanguagesCreator

    Don't forget the list of language codes: <a class="postlink" href="http://www.science.co.il/Language/Locale-codes.php">http://www.science.co.il/Language/Locale-codes.php</a>