Localization
Using a language package
In the previous section, the error message for each validator is configured by the message
option:
FormValidation.formValidation(
document.getElementById('loginForm'),
{
fields: {
username: {
validators: {
notEmpty: {
message: 'The username is required'
},
stringLength: {
message: 'The username must be more than 6 and less than 30 characters long',
...
},
regexp: {
message: 'The username can only consist of alphabetical, number and underscore',
...
},
}
},
password: {
validators: {
notEmpty: {
message: 'The password is required'
},
stringLength: {
message: 'The password must have at least 8 characters',
...
},
}
},
},
plugins: {
...
}
}
);
It is posible to use the default message from a language package. The following piece of code show how to use messages from English package:
<script src="/vendors/formvalidation/dist/js/FormValidation.min.js"></script>
<script src="/vendors/formvalidation/dist/js/locales/en_US.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function(e) {
const fv = FormValidation.formValidation(
document.getElementById('demoForm'),
{
locale: 'en_US',
localization: FormValidation.locales.en_US,
fields: {
username: {
validators: {
notEmpty: {
},
stringLength: {
min: 6,
max: 30,
},
regexp: {
regexp: /^[a-zA-Z0-9]+$/
},
}
},
password: {
validators: {
notEmpty: {
},
stringLength: {
min: 8
},
}
},
},
plugins: {
...
},
}
);
});
</script>
FormValidation has been translated into the following languages which are available in the dist/js/locales
folder (and the dist/es6/locales
folder if you want to use with ES6 module).
Language | File name | Translated by |
---|
English | en_US.js | nghuuphuoc |
Albanian | sq_AL.js | desaretiuss |
Arabic | ar_MA.js | Arkni |
Basque | eu_ES.js | xabikip |
Belgium (French) | fr_BE.js | neilime |
Belgium (Netherland) | nl_BE.js | dokterpasta |
Bulgarian | bg_BG.js | mraiur |
Catalan | ca_ES.js | ArnauAregall |
Chilean Spanish | es_CL.js | marceloampuerop6 |
Chinese | zh_CN.js | shamiao |
Czech | cs_CZ.js | AdwinTrave, budik21, cuchac |
Danish | da_DK.js | Djarnis |
Dutch (Netherland) | nl_NL.js | JvanderHeide |
Finnish | fi_FI.js | traone |
French | fr_FR.js | dlucazeau, jazzzz, neilime |
German | de_DE.js | logemann |
Greek | el_GR.js | pRieStaKos |
Hebrew | he_IL.js | yakidahan |
Hindi | hi_IN.js | gladiatorAsh |
Hungarian | hu_HU.js | blackfyre |
Indonesian | id_ID.js | egig |
Italian | it_IT.js | maramazza |
Japanese | ja_JP.js | tsuyoshifujii |
Norwegian | no_NO.js | trondulseth |
Persian (Farsi) | fa_IR.js | i0 |
Polish | pl_PL.js | grzesiek, lukaszbanasiak |
Portuguese (Brazil) | pt_BR.js | marcuscarvalho6, dgmike |
Portuguese (Portugal) | pt_PT.js | rtbfreitas |
Romanian | ro_RO.js | filipac |
Russian | ru_RU.js | cylon-v, stepin |
Serbian | sr_RS.js | markocrni |
Slovak | sk_SK.js | filipac |
Spanish | es_ES.js | vadail |
Swedish | sv_SE.js | ulsa |
Taiwanese | zh_TW.js | tureki |
Thai | th_TH.js | figgaro |
Turkish | tr_TR.js | CeRBeR666 |
Ukrainian | ua_UA.js | oleg-voloshyn |
Vietnamese | vi_VN.js | nghuuphuoc |
From v1.0.0, FormValidation(.min).js
will not contain any language package including the English one. You have to load them manually as seen in the sample code above.
The working example below shows an usage of English language package:
Look at the
L10n plugin if you want to use multiple language packages and be able to switch between them