ejSpellCheck

27 Nov 201824 minutes to read

The spell check control will be using to check/correct the spelling of words from a given content.

Syntax

  • JAVASCRIPT
  • $(element).ejSpellCheck()

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
        $('#SpellCheck').ejSpellCheck();
    </script>

    Requires

    • module:jQuery
    • module:ej.core.js
    • module:ej.data.js
    • module:ej.globalize.js
    • module:ej.scroller.js
    • module:ej.draggable.js
    • module:ej.dialog.js
    • module:ej.button.js
    • module:ej.listbox.js
    • module:ej.menu.js
    • module:ej.spellcheck.js

    Members

    dictionarySettings object

    It includes the service method path to find the error words and its suggestions also adding the custom word into the custom dictionary.

    Example – DictionarySettings field mapped with string type values

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
            });
    </script>

    dictionarySettings.dictionaryUrl string

    The dictionaryUrl option accepts string, which is the method path to find the error words and get the suggestions to correct the errors.

    Default Value

    • ””

    Example – To set the dictionaryUrl of SpellCheck control

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords"
                    }
                });
            });
    </script>

    dictionarySettings.customDictionaryUrl string

    The customDictionaryUrl option accepts string, which is the method path to add the error word into the custom dictionary.

    Default Value

    • ””

    Example – To set the customDictionaryUrl of SpellCheck control

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
            });
    </script>

    misspellWordCss string

    To display the error word in a customized style.

    Default Value

    • “e-errorword”

    Example - To display the error word in green color.

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    misspellWordCss: "highlight",
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
            });
    </script>
    
    <style>
        .highlight {
            color: green;
        }
    </style>

    locale string

    Sets the specific culture to the SpellCheck.

    Default Value

    • “en-US”

    Example - To set the French culture on SpellCheck, set its locale as fr-FR.

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    locale: "fr-FR",
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
            });
    </script>

    To set any culture for SpellCheck, refer to the required minified globalize files of the specific culture. For example, to use fr-FR culture in SpellCheck, refer to the globalize.culture.fr-FR.min.js script file. Also define the locale words of that specific culture properly. For example, define the locale words for fr-FR culture in a variable ej.SpellCheck.Locale[“fr-FR”] = { }; under script section.

    maxSuggestionCount number

    To set the maximum suggestion display count.

    Default Value

    • 6

    Example - To set the maxSuggestionCount value as 4.

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    maxSuggestionCount: 4,
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
            });
    </script>

    ignoreWords array

    To ignore the words from the error word consideration.

    Default Value

    • []

    Example - To set the ignoreWords.

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    ignoreWords: ["Syncfusion", "JavaScript"],
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
            });
    </script>

    contextMenuSettings object

    Holds all options related to the context menu settings of SpellCheck.

    contextMenuSettings.enable boolean

    When set to true, enables the context menu options available for the SpellCheck.

    Default Value

    • true

    Example - To disable the context menu options for SpellCheck control.

  • HTML
  • <div id="SpellCheck"></div>
        
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    contextMenuSettings: {
                        enable: false
                    },
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
            });
    </script>

    contextMenuSettings.menuItems array

    Contains all the default context menu options that are applicable for SpellCheck. It also supports adding custom menu items. All the SpellCheck related context menu items are grouped under this menu collection.

    Default Value

  • JAVASCRIPT
  • [
            { id: "IgnoreAll", text: "Ignore All" },
            { id: "AddToDictionary", text: "Add To Dictionary" }
        ]

    Example - To add custom context menu option to the SpellCheck.

  • HTML
  • <div id="SpellCheck"></div>
        
    <script type="text/javascript">
        $(function () {
                $("#SpellCheck").ejSpellCheck({
                    contextMenuSettings: {
                        enable: true,
                        menuItems: [
                            { id: "Ignore", text: "IgnoreOnce" },
                            { id: "IgnoreAll", text: "Ignore All" },
                            { id: "AddToDictionary", text: "Add To Dictionary" }
                        ]
                    },
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    contextClick:"onCustomMenuClick"
                });
            });
    
    
            function onCustomMenuClick(args) {
                if (args.events.ID == "Ignore") {
                    var spellObj = $("#TextArea").data("ejSpellCheck");
                    var ignoreResult = spellObj.ignore(args.selectedValue, args.targetContent, 0);
                }
            }
    
    </script>

    ignoreSettings object

    It helps to ignore the uppercase, mixed case words, alpha numeric words, file path and email addresses based on the property values.

    ignoreSettings.ignoreAlphaNumericWords string

    When set to true, ignoring the alphanumeric words from the error word consideration.

    Default Value

    • true

    Example – To consider the alphanumeric words as an error word

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    ignoreSettings:{
                        ignoreAlphaNumericWords:false
                    }
                });
            });
    </script>

    ignoreSettings.ignoreEmailAddress boolean

    When set to true, ignoring the Email address from the error word consideration.

    Default Value

    • true

    Example – To consider the Email Address as an error word

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    ignoreSettings:{
                        ignoreEmailAddress:false
                    }
                });
            });
    </script>

    ignoreSettings.ignoreMixedCaseWords boolean

    When set to true, ignoring the MixedCase words from the error word consideration.

    Default Value

    • true

    Example – To consider the MixedCase words as an error word

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    ignoreSettings:{
                        ignoreMixedCaseWords:false
                    }
                });
            });
    </script>

    ignoreSettings.ignoreUpperCase boolean

    When set to true, ignoring the UpperCase words from the error word consideration.

    Default Value

    • true

    Example – To consider the UpperCase words as an error word

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    ignoreSettings:{
                        ignoreUpperCase:false
                    }
                });
            });
    </script>

    ignoreSettings.ignoreUrl boolean

    When set to true, ignoring the Url from the error word consideration.

    Default Value

    • true

    Example – To consider the Url as an error word

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    ignoreSettings:{
                        ignoreUrl:false
                    }
                });
            });
    </script>

    ignoreSettings.ignoreFileNames boolean

    When set to true, ignoring the file address path from the error word consideration.

    Default Value

    • true

    Example – To consider the file names as an error word

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    ignoreSettings:{
                        ignoreFileNames:false
                    }
                });
            });
    </script>

    isResponsive boolean

    When set to true, allows the spellcheck to render based upon screen size.

    Default Value

    • true

    Example – To render the spellcheck dialog with the default size.

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    isResponsive:false
                });
            });
    </script>

    enableValidateOnType boolean

    Gets or sets a value that indicates whether to enable the spellcheck operation on Enter/Space key-press.

    Default Value

    • false

    Example - To validate for spellcheck the content on press the Enter & Space key.

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
    	
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    enableValidateOnType:true
                });
            });
    </script>

    controlsToValidate string

    It allows to spell check the multiple target HTML element’s texts and correct its error words.

    Default Value

    • null

    Example – To check the spelling of the three target HTML element’s (ex: div, textarea, span).

  • HTML
  • <div id="control1">
         London, one of the most popular tourist destinations in the world for a reason. A cultural and historical hub, London has an excellent public transportation system that allows visitors to see all the fantastic sights without spending a ton of money on a rental car.
         London contains four World Heritage Sites.
    </div><br />
    <textarea id="control2" style="width:940px">
         Paris, the city of lights and love - this short guide is full of ideas for how to make the most of the romanticism that oozes from every one of its beautiful corners.You couldn't possibly visit Paris without seeing the Eiffel Tower.
         Even if you do not want to visit this world famous structure, you will see its top from all over Paris.
    </textarea><br />
    <span id="control3">
         Rome, one of the world's most fascinating cities. The old adage that Rome was not built in a day - and that you won't see it in one or even in three - is true. For the intrepid traveler who can keep pace, here is a list of must-sees.
         But remember what the Romans say: Even a lifetime isn't enough to see Rome.
    </span><br /><br />
    
    <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    controlsToValidate:"control1, control2, control3"
                });
            });
    </script>

    You need to pass the target HTML element’s id value to this property with the comma separator. For example, in the above code example passed id values of div(control1), textarea(control2) and span(control3) element.

    enableAsync boolean

    When set to true, allows sending Asynchronous ajax request for checking the spelling errors.

    Default Value

    • true

    Example – To check the spelling of the target element by sending Synchronous request

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",	
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    enableAsync:false
                });
            });
    </script>

    ajaxRequestType string

    To set either ‘Post’ or ‘Get’ for ajax request type which invokes when validate, get suggestion and dictionary action.Possible values are ‘POST’ or ‘GET’

    Default Value

    • GET

    Example – To check the spelling of the target element by sending POST request

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",	
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },
                    enableValidateOnType: true,
                    enableAsync: false,
                    ajaxDataType: 'json',
                    ajaxRequestType: "POST"
                });
            });
    </script>

    ajaxDataType string

    Sets the data type for the ajax call used within the SpellCheck control, denoting the type of data that are expected to be retrieved from the server. The applicable values are json and jsonp.

    Default Value

    • “jsonp”

    Example – To check the spelling of the target element by passing the json type data

  • HTML
  • <div id="SpellCheck"></div>
    
    <script type="text/javascript">
            $(function () {
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",	
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    },                
    				ajaxDataType:"json"
                });
            });
    </script>

    Methods

    showInDialog()

    Open the dialog to correct the spelling of the target content.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.showInDialog(); // Open the dialog mode
    </script>

    validate()

    Highlighting the error word in the target area itself and correct the spelling using the context menu.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                     dictionarySettings: {
                         dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                         customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                     }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.validate(); // highlighting the error word in the target area itself 
    </script>

    spellCheck(targetSentence, misspellWordCss)

    To get the error word highlighted string by passing the given input sentence.

    Name Type Description
    targetSentence string Content to be spell check
    misspellWordCss string Class name that contains style value to highlight the error word

    Returns

    object

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                var targetSentence = "This example sentence contains error words".
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.spellCheck(targetSentence,"highlight");
    </script>
    <style>
        .highlight {
            color: green;
        }
    </style>

    ignoreAll(word, targetSentence)

    To ignore all the error word occurrences from the given input sentence.

    Name Type Description
    word string Error word to ignore from the target content
    targetSentence string Content to perform the ignore all operation

    Returns

    object

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                var targetSentence = "The first textarea sample uses a dialog textarea to display the sample spell textarea errors".
    
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.ignoreAll("textarea",targetSentence);
    </script>

    ignore(word, targetSentence, index)

    To ignore the error word once from the given input sentence.

    Name Type Description
    word string Error word to ignore from the target content
    targetSentence string Content to perform the ignore operation
    index number Index of the error word present in the target content

    Returns

    object

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                var targetSentence = "The first textarea sample uses a dialog textarea to display the sample spell textarea errors".
    
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.ignore("textarea",targetSentence, null);
    </script>

    change(word, targetSentence, changeWord, index)

    To change the error word once from the given input sentence.

    Name Type Description
    word string Error word to change from the target content
    targetSentence string Content to perform the change operation
    changeWord string Word to replace with the error word
    index number Index of the error word present in the target content

    Returns

    object

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                var targetSentence = "The first textarea sample uses a dialog textarea to display the sample spell textarea errors".
    
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.change("textarea",targetSentence,"text area", null);
    
    </script>

    The ‘index’ is the error word occurrence in the given input string. For example, if you pass the index value as 1 means and the error word as textarea it will
    ignore the second occurrence (which is present after the word dialog) in the given string.

    changeAll(word, targetSentence, changeWord)

    To change all the error word occurrences from the given input sentence.

    Name Type Description
    word string Error word to change from the target content
    targetSentence string Content to perform the change all operation
    changeWord string Word to replace with the error word

    Returns

    object

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                var targetSentence = "The first textarea sample uses a dialog textarea to display the sample spell textarea errors".
    
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.changeAll("textarea",targetSentence,"text area");
    </script>

    addToDictionary(word)

    To add the words into the custom dictionary.

    Name Type Description
    customWord string Word to add into the dictionary file

    Returns

    object

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.addToDictionary("textarea");
    </script>

    getSuggestionWords(errorWord)

    Retrieves the possible suggestion words for the error word passed as an argument.

    Name Type Description
    errorWord string Error word to get the suggestions

    Returns

    object

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                });
                var schObj = $("#SpellCheck").data("ejSpellCheck");
                schObj.getSuggestionWords("textarea");
    </script>

    Events

    actionSuccess

    Triggers on the success of AJAX call request.

    Name Type Description
    resultHTML string Returns the error word highlighted string.
    errorWordDetails object Returns the error word details of the given input.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    actionSuccess: function (args) {}
                });
    </script>

    actionBegin

    Triggers on the AJAX call request beginning.

    Name Type Description
    targetSentence string Returns the input string.
    misspellWordCss string Returns the misspellWordCss class name.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
    
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    actionBegin: function (args) {}
                });
    </script>

    actionFailure

    Triggers when the AJAX call request failure.

    Name Type Description
    errorMessage string Returns AJAX request failure error message.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
    
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    actionFailure: function (args) {}
                });
    </script>

    start

    Triggers when the dialog mode spell check starting.

    Name Type Description
    targetSentence string Returns the input string.
    errorWords object Returns the error words details.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    start: function (args) {}
                });
    </script>

    complete

    Triggers when the spell check operations completed through dialog mode.

    Name Type Description
    resultHTML string Returns the error word highlighted string.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    complete: function (args) {}
                });
    </script>

    contextOpen

    Triggers before context menu opening.

    Name Type Description
    selectedErrorWord string Returns the selected error word.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    contextOpen: function (args) {}
                });
    </script>

    contextClick

    Triggers when the context menu item clicked.

    Name Type Description
    selectedValue string Returns the selected error word.
    selectedOption string Returns the selected option in the context menu.
    targetContent string Returns the input string.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    contextClick: function (args) {}
                });
    </script>

    dialogBeforeOpen

    Triggers before the spell check dialog opens.

    Name Type Description
    spellCheckDialog object Returns the spell check window details.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    dialogBeforeOpen: function (args) {}
                });
    </script>

    dialogOpen

    Triggers after the spell check dialog opens.

    Name Type Description
    targetText string Returns the target input.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    dialogOpen: function (args) {}
                });
    </script>

    dialogClose

    Triggers when the spell check dialog closed.

    Name Type Description
    updatedText string Returns the error corrected string.
    requestType string Returns the request type value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    dialogClose: function (args) {}
                });
    </script>

    validating

    Triggers when the spell check control performing the spell check operations such as ignore, ignoreAll, change, changeAll and addToDictionary.

    Name Type Description
    argument object Event parameters when ignore the error word once:
    Name Type Description
    cancel boolean Returns the cancel option value.
    ignoreWord string Returns the error word to ignore.
    targetContent string Returns the target content.
    index number Returns the index of an error word.
    model object Returns the SpellCheck model.
    requestType string Returns the validating request type.
    type string Returns the name of the event.
    argument object Event parameters when ignore all the occurrences of an error word:
    Name Type Description
    cancel boolean Returns the cancel option value.
    ignoreWord string Returns the error word to ignore.
    targetContent string Returns the target content.
    model object Returns the SpellCheck model.
    requestType string Returns the validating request type.
    type string Returns the name of the event.
    argument object Event parameters when changing the error word occurrence once:
    Name Type Description
    cancel boolean Returns the cancel option value.
    changeableWord string Returns the error word to change.
    targetContent string Returns the target content.
    changeWord string Returns the change word to replace the error word.
    index number Returns the index of an error word.
    model object Returns the SpellCheck model.
    requestType string Returns the validating request type.
    type string Returns the name of the event.
    argument object Event parameters when changing all the occurrences of an error word:
    Name Type Description
    cancel boolean Returns the cancel option value.
    changeableWord string Returns the error word to change.
    targetContent string Returns the target content.
    changeWord string Returns the change word to replace the error word.
    model object Returns the SpellCheck model.
    requestType string Returns the validating request type.
    type string Returns the name of the event.
    argument object Event parameters when adding the error word into the dictionary file:
    Name Type Description
    cancel boolean Returns the cancel option value.
    customWord string Returns the custom word to add into dictionary file.
    model object Returns the SpellCheck model.
    requestType string Returns the validating request type.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    validating: function (args) {}
                });
    </script>

    targetUpdating

    Triggers before loading the target HTML element text into the dialog sentence area.

    Name Type Description
    previousElement Object Returns the previous target element value.
    currentElement Object Returns the current target element value.
    targetHtml string Returns the target html value.
    cancel boolean Returns the cancel option value.
    model object Returns the SpellCheck model.
    type string Returns the name of the event.

    Example

  • HTML
  • <div id="SpellCheck"></div> 
     
    <script>
                $("#SpellCheck").ejSpellCheck({
                    dictionarySettings: {
                        dictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/CheckWords",
                        customDictionaryUrl: "http://js.syncfusion.com/demos/ejservices/api/SpellCheck/AddToDictionary"
                    }
                    targetUpdating: function (args) {}
                });
    </script>