Question

I’m a bit confused as to how to solve this problem. Seems standard and commonly occurring but couldn’t find anything worthwhile. I have an HTML textarea and a textbox for input. I want to validate the following:

1. The user shouldn’t be allowed to enter a bunch of white spaces in the textarea – so if 15 characters is the minimum 16 whitespace characters only shouldn’t count towards valid data. A simple char count won’t detect this.
2. One can enter 16 whitespaces and one letter, but that is still invalid data! Anyway to check to check the validity here (it should basically be counted as 2 characters as per below point)?
3. Trimming unnecessary whitespaces – i.e., if someone enters a character/word and follows it up by 10 whitespaces then another and then a character and another set of whitespaces, I’d like them to be trimmed to a single white space. Just like what happens when you enter an answer/new question on SO. If you enter a bunch of whitespaces it will automatically trim it. I tried searching around but nothing for whitespace specific.

Intuitively if I can just get solution to #3 to work I guess it could automatically feed it into a char counter function and it would be valid, correct?

Any ideas how to go about doing this? jQuery or javascript are both acceptable 🙂

Answer 1

You can replace all occurrences of more than one space with one space via a regular expression (live example):

var text = "a     b     c";
text = text.replace(/  +/g, ' ');
alert(text); // "a b c"

That works by looking for a space followed by one or more spaces, globally, and replacing them with just the one space.

Note that that regular expression is specific to spaces. It doesn’t handle other forms of whitespace. If you wanted to replace all occurrences of two or more whitespace characters with one space, you could do this:

var text = "a \t\r\n b \t\r\n c";
text = text.replace(/\s\s+/g, ' ');
alert(text); // "a b c"

That uses the \s (whitespace) character class. Note that most implementations do a pretty good job applying \s correctly, but there are bugs with some of them related to some of the more esoteric whitespace characters defined by Unicode even though the specification clearly says they should also be handled. (You can find out how your favorite browsers do here, or read up more on the issue here.) It’s very unlikely you’d care for the use case you describe, you probably don’t have to worry about it.