3

Can anyone help me with the following regex

<script type="text/javascript">
        function quoteWords() {
            var search = document.getElementById("search_box");
            search.value = search.value.replace(/^\s*|\s*$/g, ""); //trim string of ending and beginning whitespace
            if(search.value.indexOf(" ") != -1){ //if more then one word
                search.value = search.value.replace(/^"*|"*$/g, "\"");
            }
        }
  </script>

<input type="text" name="keywords" value="" id="search_box" size="17">
<input onClick="quoteWords()" type="submit" value="Go">

Issue : It breaks when manually adding double quotes and pressing submit, one extra double quote is entered at the end. The regex code should see if the double quotes exist, it should not add any thing.

So it makes "long enough" to "long enough"" <- it adds an extra double quote at the end

Can anyone check the regex code so see how to solve this issue.

I only want the double quotes to be inserted once.

Improve this question
7
  • are you just wanting to 'wrap' the value with double quotes if there is more than one word and it has not already been wrapped? Commented May 27, 2011 at 3:50
  • 1
    I am stumped, as far as I knew * always acted greedily, so it should work. Commented May 27, 2011 at 3:53
  • I believe you should have used id="search_box" in the first INPUT element. Commented May 27, 2011 at 3:55
  • @Matty K you are right, but I tested it after changing them to match and it shows the behaviour he is talking about. Commented May 27, 2011 at 3:56
  • @Matty K, it was a type from the old code. Both the ids are same Commented May 27, 2011 at 4:12

4 Answers 4

Reset to default
3

The error is definitely happening in this line:

search.value = search.value.replace(/^"*|"*$/g, "\"");

And it is due to the fact that "* matches 0 or more quotes. However, you presumably wouldn't want to just replace it with "+ since that wouldn't do the job you wanted of double-quoting strings with spaces in them.

You probably just want to do something like this, in two statements:

search.value = search.value.replace(/^"*|"*$/g, '')
search.value = '"' + search.value + '"'

Part of the key is that there is no 'end of string' character to consume - the regex engine 'just knows' when it is at the end of the string. So after matching a quote at the end of the string, the cursor just moves to the end of the string, and it finds the empty string one more time before falling off the string. Thus, the quote at the end of the string is replaced by a quote, and the 'nothing' at the end of the string is also replaced by a quote.

I recommend taking a look at the ECMAScript spec at http://www.ecma-international.org/publications/files/ECMA-ST/ECMA-262.pdf sections 15.5.4.10 and 15.5.4.11 yourself. However, I've also provided an intuitive illustration of how this works at this gist.

EDIT:

Since people seem confused as to why this would happen, here's something that might help:

http://www.grymoire.com/Unix/Sed.html#uh-6

That's from the documentation for sed, but it explains why combining * and /g is a bad idea. The fact that JS doesn't just explode when you do that is a mark in its favor. Note that there are an infinite number of '0 characters' at every position in the string.

Improve this answer
Sign up to request clarification or add additional context in comments.

19 Comments

or in one line: search.value = '"' + search.value.replace(/^"*|"*$/g, '') + '"';
I suspect, intuitively but without any justification, that the regexp replacement algorithm is bugging because of the way it replaces $. If you start with no quotes and keep clicking the button, you end up with one, then two quotes, but never more. Perhaps the global $ search has a residual second-match somewhere in the regexp engine that causes a second "replacement".
@Jonathon Basically, since it was globally replacing '0 or more quotes followed by the end of input', it found that twice - one was the quote and the other was the nothing between the quote and the end of input. My code just strips the quotes if they exist, and then add a nice pair like OP wanted. ETA: the key is the /g
@Thom does that mean the regexp engine rescans the end-of-string; and so does a match-and-replace to produce the first quote, but then instead of falling off the end of the string (having already consumed the $), goes again and matches the end-of-string by itself?
I'm quite sure that the problem isn't the global matching of zero-or-more quotes, since javascript can obviously handle that gracefully in this situation at the start-of-string. It seems to me that the issue is with it not "consuming" the end-of-string token with the first match. I can't comprehend why it would make two replacements.
|
3

I'm guessing that your problem is that you're getting three matches on a string like

"long enough"

The first match is the start plus the first quote (since regexes are greedy by default). The second match is the end quote and end of string ($). However, since the end of string is not an actual character, a third match of 0 characters at the end of string is perhaps occurring.

One possible solution would be to add quotes to the string and then replace one or more quote instead of zero or more quotes:

search.value = (search.value + '"').replace(/^"*|"+$/g, "\"");
Improve this answer

1 Comment

Your solution worked. Ill keep testing and see if any problem arises
2

In a regex, * matches 0 or more instances of the preceding item, and + matches 1 or more instances. Since you're using *, the regex matches when there are 0 or more characters that match \s in your first regex, and 0 or more "s in your second. Changing your *s to +s should give you the behavior you expect.

Edit: If you want to make it so that the result is surrounded by double quotes if they don't exist at the beginning or ending of the line, use something like /^[^"]|[^"]$ which reads as "the start of a line followed by any character other than a double-quote or any character other than a double quote followed by the end of a line"

Double Edit: That should probably be /^[^"\w]|[^"\w]$/ to make sure you don't replace the first and last characters of your match :/

Improve this answer

10 Comments

I think he wants to make sure double quotes exist, only adding them if they don't
It did not work in my test, and logically it does not make any sense (but then I was involved in a previous iteration of this question so understand more of what is wanted here)
@Jonathon Wisnoski, i did reply back in the other question. But i think you were not informed by StackOverFlow
If you enter the text a b, then using + won't add quotes to produce "a b". I believe what confused OP - and has subsequently confused me - is why, with the code as-is, entering a b and clicking the button twice ends up with the string "a b" and then "a b""
@jswolf19 , I think you're right, I updated my answer to reflect that. @MattyK - because it replaces any number of double quotes followed by the end of a line with a double quote, I think, but I'm not sure because I'm only interpreting this in my head, that the first single quote is there because the first quote gets stripped and replaced (if that's the case, just entering example lample should result in "xample lample" ...
|
1

You can use + instead of *:

search.value = search.value.replace(/^"+|"+$/g, '"');
Improve this answer

1 Comment

The + breaks my requirement. I need the double quotes to be inserted automatically

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.