GK79
GK79

Reputation: 251

HTML textarea spellcheck: How to tell if user makes spelling errors

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?

Upvotes: 15

Views: 11480

Answers (4)

Fedeco
Fedeco

Reputation: 876

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.

Upvotes: 1

Geeky
Geeky

Reputation: 7498

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

Upvotes: 2

Lalji Dhameliya
Lalji Dhameliya

Reputation: 1769

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

JavaScript SpellCheck

http://www.javascriptspellcheck.com/

Upvotes: 2

e-nouri
e-nouri

Reputation: 2626

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).

Upvotes: 11

Related Questions