JQuery Validation Internationalization Problem

问题

How can I change JQuery Validation plugin that gives error message at browser's language. I mean if I run it on a browser that has English language errors will be in English or if the browser's language is Turkish error messages will be Turkish too(of course I will define messages at that languages, also I should define a default language if I didn't define an error message list according to browser's language)

回答1:

You could have a look at the jquery's localisation plugin: http://keith-wood.name/localisation.html
It allows loading javascript files based on the browser's defined language.

The jquery validation plugin comes with localisation files available at this adress: http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/localization/messages_##.js where ## is the loc code.

What you can do is load the validation plugin with the default error messages and then use the localization plugin to load the language-specific error messages. You can even write your localized js file, syntax is pretty trivial:

/*
 * Translated default messages for the jQuery validation plugin.
 * Locale: FR
 */
 jQuery.extend(jQuery.validator.messages, {
    required: "Ce champ est requis.",
    remote: "Veuillez remplir ce champ pour continuer.",
    email: "Veuillez entrer une adresse email valide.",
    url: "Veuillez entrer une URL valide.",
    date: "Veuillez entrer une date valide.",
    dateISO: "Veuillez entrer une date valide (ISO).",
    number: "Veuillez entrer un nombre valide.",
    digits: "Veuillez entrer (seulement) une valeur numérique.",
    creditcard: "Veuillez entrer un numéro de carte de crédit valide.",
    equalTo: "Veuillez entrer une nouvelle fois la même valeur.",
    accept: "Veuillez entrer une valeur avec une extension valide.",
    maxlength: jQuery.validator.format("Veuillez ne pas entrer plus de {0} caractères."),
    minlength: jQuery.validator.format("Veuillez entrer au moins {0} caractères."),
    rangelength: jQuery.validator.format("Veuillez entrer entre {0} et {1} caractères."),
    range: jQuery.validator.format("Veuillez entrer une valeur entre {0} et {1}."),
    max: jQuery.validator.format("Veuillez entrer une valeur inférieure ou égale à  {0}."),
    min: jQuery.validator.format("Veuillez entrer une valeur supérieure ou égale à  {0}.")
});

Hope this helps !

回答2:

Jquery validation plugin works with an array variable. I defined different array variables as like:

locale_tr, locale_en, locale_sw etc.

I get browser's language as two character as like

tr en sw

and I call the variable of :

locale_ + browser's two character language

so it works for me.

回答3:

Here's a suggestion for a simple way to set your custom validation message:

1. Create a js file with XX_Messages.ee.js name with syntax:

 LANG = {

    PERSONAL_BIRTHDAY_CAN_T_BLANK : 'Birthday cannot be left blank',
    PERSONAL_COUNTRY_CAN_T_BLANK : 'Country cannot be left blank',
    PERSONAL_CITY_CAN_T_BLANK : 'City cannot be left blank',
.......
TEAM_EMAIL_NOT_VALID : 'E-mail is not a valid email address'
};

<head>
....
<g:set var="locale" value="${session['language']}"/>
    <g:if test="${locale.equals("ee")}">
        <script src="${resource(dir: 'js',file:'/XX_Messages.ee.js')}"></script>
    </g:if>
....
</head>

Note: import your XX_Messages.ee.js in html head where you want validation

messages: {
            gender: {
                required: LANG.PERSONAL_BIRTHDAY_CAN_T_BLANK
            },
            firstName: {
                required:  LANG.PERSONAL_CITY_CAN_T_BLANK
            },
            lastName: {
                required: LANG.PERSONAL_COUNTRY_CAN_T_BLANK
            }
        }

Note: XX_Messages.ee.js file must be import in head of your html before your validation js.

来源：https://stackoverflow.com/questions/7091206/jquery-validation-internationalization-problem

标签

jquery

internationalization

jquery-validate