Add spellchecking-as-you-type or spelling dialog windows to any website or intranet project using jQuery code.
Calling the spellchecker takes only 1 line of jQuery / JS code:
spellCheckInDialog spellCheckInDialog is used to power the spellcheck button onClick
$('#myTextArea').spellCheckInDialog()
spellAsYouType
spellAsYouType is used to provide Spell-Check-As-You-Type suggestions with a context menu and 'red-wiggly underlines'
$('textarea').spellAsYouType();
Configuration Options
The you can pass a settings object into the function call to completely control the spellchecker behavior.
$(function() {$('textarea').spellAsYouType(defaultDictionary:'Espanol',checkGrammar:true);});
Install the plugin undser 5 minutes
<script type="text/javascript" src='/jquery/jquery.min.js' > <script type="text/javascript" src='/JavaScriptSpellCheck/include.js' ></script>
jQuery has an excellent $ 'selector' system which we utilize on the main spell check methods.
The plugin is unique for jQuery spell-checking because:
jQuery spellcheck is a plug-in for the jQuery dialect of JavaScript, which adds contextual and dialogue-based spell checking in any web application.
The spellchecking provided can be entirely controlled by the developer we can guarantee that spellchecking capabilities are available irrespective of the browser platform the user employs. this includes guaranteeing the correct dictionaries are installed in over 20 languages, and being able to fine tune this vocabulary to exactly meet business and organizational requirements: including specialist words like company names people names and so on.
It can be used to spell check text areas inputs and, and in fact any element of the Dom tree even if it is not edible editable. this includes rich editors such as CKEditor and TinyMCE.
jQuery spellcheck is an extension to the existing JavaScript spell check which already has a global user base including 30+ world governments and a large portion of the Fortune 500. it has been developed and honed for a decade as of 2017.
jQuery spellcheck is installed by simply uploading folder into your website or web application unlike other free plug-ins, it does not require GPL spellchecking libraries (such as pspell) to be installed on your server. Everything required including the backend spellchecking technology and dictionaries is included within the plug-in you install.
It also does all the spellchecking on your own servers without sending your data off to 3rd parties such as Google servers which is clearly a security violation, though this technique has been used by other plug-ins in the past.
Just copy, paste & upload!
You, teh developer, will need to link to JavaScript spell check/info .es in your HTML directly after including the jQuery library using a script tag
jQuery spell check can be installed on Linux Mac & Windows Web server in exactly the same manner. It also works equally well on localhost.
The backend to this plug-in (which you don't need to modify yourself), provides handlers compatible with IIS party and Internet out-of-the-box ( using PHP, C#, VB.net and JS). So that is one less thing to worry about. everything is dealt with in the user interface layer. we find that many intranet developers prefer to apply the spellchecking within the user interface layer even though they are seasoned back-end developers, simply because it abstracts user interface to the right part of the application and the clusters the backend.
Ensuring the quality of data entered into a website business system. Otherwise why have an intranet or a CMS? It is clearly important if you want the data to be used and searchable and the future. this plug-in provides a single solution that covers quality of data entry including rudimentary grammar checking across all platforms.
If your web application as a functional requirement to guarantee data quality or provide consistent spellchecking to the user then this plug-in is ideally placed to meet that requirement in a consistent reliable manner. we cannot guarantee what browser platform the end-user will be using, and whether or not they will have quality spellchecking capabilities installed.
Function | Return Value | Description |
---|---|---|
$('#mySelction').spellCheckInDialog(options) | Opens a spellchecking dialog window | Spelling Instance Object
|
$('#mySelction').spellAsYouType(options) | Spelling Instance Object | Causes any texarea(s) selected to underline any misspelled words - and provides spelling
suggestions on right click.
|
$('#mySelction').binSpellCheckFields(options) | *True if all fields are spelled correctly
|
Spell checks all field in the selection.
|
jQuery Configuration Options
Option | Default Value | Description |
---|---|---|
defaultDictionary | "English (International)" | Default dictionary the spell checker will use.
|
userInterfaceTranslation | "en" | Translates the spellchecker dialog into over 50 international languages automatically. |
showStatisticsScreen | true | Shows statistics such as word count and number of edits after spellCheckInDialog is complete. |
submitFormById | "" | javascript id of a form to submit after spellCheckInDialog is complete. |
theme | "modern" | CSS theme to apply to the spellchecker.
|
caseSensitive | true | Catches spelling mistakes caused by iNcoorect CasIng. |
checkGrammar | true | Catches basic grammar mistakes such as repeated words, sentence casing and punctuation |
ignoreAllCaps | true | Ignores BLOCK CAPS which are often abbreviations or product codes. |
ignoreNumbers | true | Ignores w0rds w1th num8rs in them which are often product codes. |
showThesaurus | true | Shows a thesaurus and word meaning lookup during spellCheckInDialog |
showLanguagesInContextMenu | true | Allows the user to change dictionary 'on the fly' when using spellAsYouType |
serverModel | "auto" | Chooses the server model that does the 'behind the scenes' AJX spellchecking requests. We
support:
|
popUpStyle | "auto" | spellCheckInDialog pop-up style:
See the custom PopUps And Themes Tutorial. |
Function | Description | Example |
---|---|---|
$Spelling.SpellCheckInWindow(Fields) | Opens a spellchecking dialog window
|
Live Demo With Source Code... |
$Spelling.SpellCheckAsYouType(Fields) | Causes any texarea(s) to underline any misspelled words - and provides spelling suggestions on
right click.
|
Live Demo With Source Code... |
$Spelling.LiveValidation(Field,MessageElementId) | Shows a warning message beside Field when it contains spelling errors.
|
Live Demo With Source Code... |
Function | Description | Example |
---|---|---|
$Spelling.BinSpellCheck(input) | Returns bool:
| Live Demo With Source Code... |
$Spelling.BinSpellCheckFields(Fields) | Spell checks one or more fields in your page - and returns bool:
| Live Demo With Source Code... |
$Spelling.SpellCheckSuggest(input) | Returns an array of spelling suggestions for input. | Live Demo With Source Code... |
$Spelling.ListDictionaries() | Returns an array of currently installed dictionaries in your JavaScriptSpellCheck/dictionaries folder. | Live Demo With Source Code... |
Function | Description | Example |
---|---|---|
o = $Spelling.AjaxSpellCheck(input);
o.onSpellCheck = function(result,suggestions){} | Spellchecks a word and asynchronously returns a boolean spellchecking result and suggestions. | Live Demo With Source Code... |
o = $Spelling.AjaxSpellCheckFields(Fields)
o.onValidate = function(result){} | Spell checks one or more fields in your page - and returns asynchronously a boolean spellchecking result. | Live Demo With Source Code... |
o = $Spelling.AjaxDidYouMean(string)
o.onDidYouMean = function(result){} | Asynchronously returns an suggestions string for a search box spellchecking phrase. | Live Demo With Source Code... |
Property | Type | Default Value | Description |
---|---|---|---|
$Spelling.DefaultDictionary | string | "English (International)" | The dictionary language used by JavaSript SpellCheck.
|
$Spelling.UserInterfaceTranslation | string | "en" | Translates the context menu and spellchecker dialog into over 50 international languages.
|
$Spelling.ShowStatisticsScreen | bool | false | Shows a statistics screen (word count, edit count) after SpellCheckInWindow. |
$Spelling.SubmitFormById | string | "" | Will submit a form (identified by its id attribute) once spellchecking once SpellCheckInWindow is complete. |
$Spelling.Theme | string | "js.modern" | Allows you to apply a CSS theme to change the appearance of JavaScript SpellCheck.
|
$Spelling.CaseSensitive | bool | true | Spellchecker notices cAse mIstAkes |
$Spelling.IgnoreAllCaps | bool | true | Spellchecker ignores BLOCK CAPITAL letters which are often acronyms. |
$Spelling.CheckGrammar | bool | true | Spellchecker notices basic grammar mistakes such as sentence casing and repeated words. |
$Spelling.IgnoreNumbers | bool | true | Spellchecker ignores words with numbers in them like "High5" or "MSO7262BGO" |
$Spelling.ShowThesaurus | bool | true | Spellchecker shows a thesaurus and look-up-meaning link during SpellCheckInWindow |
$Spelling.ShowLanguagesInContextMenu | bool | false | Allows the user to pick a dictionary Language from all installed dictionaries during SpellCheckAsYouType |
$Spelling.ServerModel | string | "auto" | Allows you to pick which server model JavaScriptSpellCheck will use for its AJAX requests. Values available are:
|
$Spelling.PopUpStyle
| string | "modal" | SpellCheckInWindow pop-up style:
See the custom PopUps And Themes Tutorial.
|
Event | Description | Example |
---|---|---|
onDialogOpen() | SpellCheckInWindow dialog pops up. | $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onDialogComplete() | SpellCheckInWindow dialog completes successfully - user has not quit | $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onDialogCancel() | SpellCheckInWindow dialog completes is quite by the user | $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onDialogClose() | SpellCheckInWindow dialog closes for any reason | $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onChangeLanguage(language) | SpellCheckInWindow or SpellAsYouType language is changed by the user.
| $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onIgnore(word) | A word is ignored by the user in wither SpellCheckInWindow or SpellAsYouType.
| $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onIgnoreAll(word) | The user clieck 'Ignore All' for a word in either SpellCheckInWindow or SpellAsYouType.
| $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onChangeWord(from,to) | The user changes a word in either SpellCheckInWindow or SpellAsYouType.
| $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onChangeAll(from,to) | The user clicks 'Change All' for a word in SpellCheckInWindow.
| $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onLearnWord(word) | The user "Adds to Dictionary" in either SpellCheckInWindow or SpellAsYouType.
| $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onLearnAutoCorrect(from,to) | The user adds to autocorrect in SpellCheckInWindow.
| $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
onUpdateFields(arrFields) | Any field is updated due to spellchecing.
| $Spelling.PopUpStyle="modeless";
o = $Spelling.SpellCheckInWindow('all'); |
JavaScriptSpellCheck also provides a jQuery SpellCheck Plugin
jQuery Functions
Function | Return Value | Description |
---|---|---|
$('#mySelction').spellCheckInDialog(options) | Opens a spellchecking dialog window | Spelling Instance Object
|
$('#mySelction').spellAsYouType(options) | Spelling Instance Object | Causes any texarea(s) selected to underline any misspelled words - and provides spelling suggestions on right click.
|
$('#mySelction').binSpellCheckFields(options) | *True if all fields are spelled correctly
| Spell checks all field in the selection.
|
jQuery Options
Option | Default Value | Description |
---|---|---|
defaultDictionary | "English (International)" | Default dictionary the spell checker will use.
|
userInterfaceTranslation | "en" | Translates the spellchecker dialog into over 50 international languages automatically. |
showStatisticsScreen | true | Shows statistics such as word count and number of edits after spellCheckInDialog is complete. |
submitFormById | "" | javascript id of a form to submit after spellCheckInDialog is complete. |
theme | "modern" | CSS theme to apply to the spellchecker.
|
caseSensitive | true | Catches spelling mistakes caused by iNcoorect CasIng. |
checkGrammar | true | Catches basic grammar mistakes such as repeated words, sentence casing and punctuation |
ignoreAllCaps | true | Ignores BLOCK CAPS which are often abbreviations or product codes. |
ignoreNumbers | true | Ignores w0rds w1th num8rs in them which are often product codes. |
showThesaurus | true | Shows a thesaurus and word meaning lookup during spellCheckInDialog |
showLanguagesInContextMenu | true | Allows the user to change dictionary 'on the fly' when using spellAsYouType |
serverModel | "auto" | Chooses the server model that does the 'behind the scenes' AJX spellchecking requests. We support:
|
popUpStyle | "auto" | spellCheckInDialog pop-up style:
See the customPopUps And Themes Tutorial. |