Localization

SpellCheck dialog mode comes with default localization support which allows it to customize the display of text within the SpellCheck dialog in a user-specific culture and locale. The SpellCheck control can be localized in specific culture using the common API locale along with the collection of localized words defined for that culture using the ej.SpellCheck.Locale [culture-code].

By default, the SpellCheck control is localized in en-US culture. Please find the following table lists the default keywords and its localized text values for en-US culture.

Locale key words Text
SpellCheckButtonText Spelling:
NotInDictionary Not in Dictionary:
SuggestionLabel Suggestions:
IgnoreOnceButtonText Ignore Once
IgnoreAllButtonText Ignore All
AddToDictionary Add to Dictionary
ChangeButtonText Change
ChangeAllButtonText Change All
CloseButtonText Close
CompletionPopupMessage Spell check is complete
CompletionPopupTitle Spell check
Ok OK
NoSuggestionMessage No suggestions available
NotValidElement Specify the valid control id or class name to spell check

To localize SpellCheck into any particular culture, it is necessary to refer the culture-specific script files in your application after the reference of ej.web.all.min.js file, which are available under the following location.

<Installed location>\Syncfusion\Essential Studio\17.3.0.9\JavaScript\assets\scripts\i18n

The following code example shows how to localize the SpellCheck control in fr-FR culture.

  • html
  • <ej-spellcheck id="SpellCheck" contenteditable="true" style="display:block" [dictionarySettings]="dictionarysettings" [contextMenuSettings.enable]="false" locale="fr-FR">
        Facebook is a social networking service headquartered in Menlo Park, California. Its website was launched on February 4, 2004, by Mark Zuckerberg with his Harvard College roommates and fellow students Eduardo, Andrew McCollum, Dustin and Chris Hughes. The fouders had initially limited the websites membrship to Harvard students, but later expanded it to collges in the Boston area, the Ivy League, and Stanford Univrsity. It graually added support for students at various other universities and later to high-school students.
    </ej-spellcheck>
    <input id="CheckSpell" type="button" class="ejinputtext" style="height:30px" value="Spell check" (click)="checkErrors($event)" />
  • javascript
  • export class SpellCheckComponent {
        public dictionarysettings: any;
        constructor() {
            this.dictionarysettings = {
                dictionaryUrl: "http://js.syncfusion.com/ejServices/api/SpellCheck/CheckWords",
                customDictionaryUrl: "http://js.syncfusion.com/ejServices/api/SpellCheck/AddToDictionary"
            };
            ej.SpellCheck.Locale["fr-FR"] = {
                SpellCheckButtonText: "Orthographe",
                NotInDictionary: "Pas dans le dictionnaire",
                SuggestionLabel: "Suggestions",
                IgnoreOnceButtonText: "Ignorer une fois",
                IgnoreAllButtonText: "Ignorer tout",
                AddToDictionary: "Ajouter au dictionnaire",
                ChangeButtonText: "Changement",
                ChangeAllButtonText: "Tout modifier",
                CloseButtonText: "Fermer",
                CompletionPopupMessage: "Vérification orthographique est terminée",
                ErrorPopupMessage: "Vérification orthographique est pas terminée",
                CompletionPopupTitle: "Vérification orthographique alerte",
                OK: "D'accord",
                NoSuggestionMessage: "Aucune suggestion disponible",
            };
        }
        checkErrors(event) {
            let spellObj = $('#SpellCheck').data('ejSpellCheck');
            spellObj.showInDialog();
        }    
    }

    NOTE

    Refer the ej.culture.fr-FR.min.js file in your HTML application and also define the locale property for the SpellCheck control with the appropriate culture-code [fr-FR].

    For further information on how to refer the required culture scripts into your application, refer here.

    Localizing Specific Words

    To customize or localize only some specific words in the default ej.SpellCheck.Locale["en-US"] collection, the words to be localized/customized can be defined in a separate variable and then extended to the original collection as depicted in the following code example.

  • html
  • <ej-spellcheck id="SpellCheck" contenteditable="true" style="display:block" [dictionarySettings]="dictionarysettings" [contextMenuSettings.enable]="false">
        Facebook is a social networking service headquartered in Menlo Park, California. Its website was launched on February 4, 2004, by Mark Zuckerberg with his Harvard College roommates and fellow students Eduardo, Andrew McCollum, Dustin and Chris Hughes. The fouders had initially limited the websites membrship to Harvard students, but later expanded it to collges in the Boston area, the Ivy League, and Stanford Univrsity. It graually added support for students at various other universities and later to high-school students.
    </ej-spellcheck>
    <input id="CheckSpell" type="button" class="ejinputtext" style="height:30px" value="Spell check" (click)="checkErrors($event)" />
  • javascript
  • export class SpellCheckComponent {
        public dictionarysettings: any;
        constructor() {
            this.dictionarysettings = {
                dictionaryUrl: "http://js.syncfusion.com/ejServices/api/SpellCheck/CheckWords",
                customDictionaryUrl: "http://js.syncfusion.com/ejServices/api/SpellCheck/AddToDictionary"
            };
            var customizationMessage = {
    			CompletionPopupMessage: "Completed",
    		};
    		// Extend only the required changes to the original locale collection
    		$.extend(ej.SpellCheck.Locale["en-US"], customizationMessage);
        }
        checkErrors(event) {
            let spellObj = $('#SpellCheck').data('ejSpellCheck');
            spellObj.showInDialog();
        }    
    }