CODEWITHSUNDEEP
jqueryvalidationlocalizationsemantic-ui
German
German

Reputation: 137

How to localize "prompt" Semantic UI form validation?

How can I localize the values of prompt in the code below?

$('.ui.form').form(
fields: {
  email: {
    identifier : 'email',
    rules: [
      {
        type   : 'email',
        prompt : 'Please enter a valid e-mail'
      }
    ]
  },
  ccEmail: {
    identifier : 'cc-email',
    optional   : true,
    rules: [
      {
        type   : 'email',
        prompt : 'Please enter a valid second e-mail'
      }
    ]
  }
}});

I would like 'Please enter a valid e-mail' and 'Please enter a valid second e-mail' to be shown in the user's language.

Upvotes: 0

Views: 648

Answers (1)

Kiran Shakya
Kiran Shakya

Reputation: 2559

var userLang = navigator.language || navigator.userLanguage;
var availableLang = ["en", "es", "cn"];
if (availableLang.indexOf(userLang) == -1) {
  console.log("Loading default language 'EN'");
  userLang = "en";
}
var lang;
$.getJSON("path_to_lang_" + userLang + ".json", function(data) {
  lang = data;
  $('.ui.form').form(
    fields: {
      email: {
        identifier: 'email',
        rules: [{
          type: 'email',
          prompt: lang.firstEmail
        }]
      },
      ccEmail: {
        identifier: 'cc-email',
        optional: true,
        rules: [{
          type: 'email',
          prompt: lang.secondEmail
        }]
      }
    }
  });
});

Above snippet detects navigator language and checks with available language set. If localization to navigator language is not available, loads default language.

You should change "path_to_lang_" to some valid path to your localization files.

Lets suppose you have files like "langs/lang_en.json", then your "path_to_lang_" should be "langs/lang_".

After loading your lang file, then we initialize your code with loaded localized text.

Sample content of "langs/lang_en.json"

{'firstEmail':'Please enter a valid e-mail','secondEmail':'Please enter a valid second e-mail'}

Upvotes: 2

Related Questions