14

I have a textarea that is defined thus:

<textarea spellcheck="true"></textarea>

When users type, spelling mistakes are highlighted to them (using a red underline, for my browser). Is there any way (using jQuery) to check whether there are spelling mistakes before a user submits the form?

This is what I want to achieve:

Form input textarea: [Typing some text in thsi box] [submit]

Before the user clicks submit, I would like a listener to "catch" the fact that "thsi" was spelled incorrectly and prompt the user. Is there any way to do this via the html5 spellcheck method, or do I have to use a custom javascript function for the spellchecking and listening?

GK79
  • 241
  • 1
  • 4
  • 17
  • 1
    Very closely related: http://stackoverflow.com/questions/30704264/how-to-access-chrome-spell-check-suggestions-in-javascript – nicovank Dec 16 '16 at 05:49

4 Answers4

11

A quick search brought up this jQuery plug-in that seems to do exactly what you want and it uses the Google spell-checking API https://code.google.com/p/jquery-spellchecker/wiki/Documentation

There is also Typo.js https://github.com/cfinke/Typo.js, which is a client-side based library. It does not use any API, instead it uses Hunspell-style dictionaries and it is only available for American English "EN_US".

If you don't want to use a plug-in or an existing code snippet, you can build your own by sending an ajax request to check the typed text against a service provider (Google in this case).

Eric
  • 6,563
  • 5
  • 42
  • 66
e-nouri
  • 2,576
  • 1
  • 21
  • 36
  • Unfortunately Google has stopped its spell checking API, from what I know. So any script that uses it will fail. Also, I was hoping to build upon the spellcheck that is already done as part of the HTML5 spellcheck="true" specification instead of installing a NEW script to do ANOTHER spell check on the same piece of text. Sorry. – GK79 Oct 18 '14 at 02:47
  • 2
    The HTML5 spellcheck API depends on the user configuration, you still can configure the language with the attribute lang="" but that won't be helpful if the API is disabled on the browser, so if you want to spellcheck the textarea you have to implement your own mechanism, to be free from the user choices and settings. – e-nouri Oct 20 '14 at 07:58
2

you can use jquery plugin for checking spelling. i hope it helps you, thanks.

JavaScript SpellCheck

http://www.javascriptspellcheck.com/

Lalji Dhameliya
  • 1,729
  • 1
  • 17
  • 26
2

If you have to build it natively you might consider building a Trie datastructure for this

check this Trie reference 1 Trie reference 2

Hope this helps

Geeky
  • 7,420
  • 2
  • 24
  • 50
1

You have different ways to achieve it, it depends if your spelling has to be focused on a subject (like medical word spelling) or is it general.

  1. Create yourself a dictionary (not the best choice and too long to make)
  2. make a query to online dictionaries like google
  3. try Jspell Evolution (the installation is a little annoying but once done it works very well Jspell Evolution website
  4. you can look at typo.js typo.js article

Yesterday I found this article that is 10 times better than the others : Article for javascript spell check locales where you can also have spelling for other languages/locales and not only english locale.

Fedeco
  • 846
  • 10
  • 28