views:

490

answers:

4

I'll start out by giving you the code I'm working on so that you can follow what I'm saying (sorry for the french, I realise all of you don't speak french but I'm making this website for a french-speaking school). I've edited out what I don't think is part of the problem (the actual file is 757 lines long!)

photos.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Photos</title>
<script type="text/javascript">
    function removeCriterion(criterionText)
    {
     var getData = new RegExp("&" + criterionText + "|\\?" + criterionText + "$|" + criterionText + "&", "gi");
     window.location = window.location.toString().replace(getData,"");
    }
</script>
</head>
<body>
<a class="retirerCritere" onclick="removeCriterion('Shawn+Freyssonnet-Inder');" title="Réessayer la recherche sans ce critère"><img src="img/deleteButton.png" alt="Retirer" /></a>
</body>
</html>

Although it doesn't look like much with all the extras stripped out, this is part of a page which displays photos based on a set of criteria. These criteria are fetched through php variable $_GET, so if I want to show all the photos that belong to me (Shawn Freyssonnet-Inder) and which were taken in France, I use the following link:

<a href="photos.php?nom=Shawn+Freyssonnet-Inder&pays=France" ...>link</a>

This page then fetches all photos for which nom = Shawn Freyssonnet-Inder and pays = France in a mysql database. In addition, it shows the user the list of criteria used to filter the results, allowing him (her) to isolate a criterion, remove a criterion, etc.

note: The space is replaced with a plus sign (+) with php function urlencode. I remove the plus sign using urldecode before showing the txt on the page, making sure the user has the appropriate human-friendly version of the string. Now when I call the removeCriterion function, I use the same urlencoded string as argument so I believe there should be no problem for javascript in finding the text in the url.

My problem occurs when trying to remove a criterion. As you can see, I remove criteria with the removeCriterion javascript function, which simply finds the criterion definition in the url and removes it (find and replace). But for some reason, on certain criteria, it doesn't work, such as "Shawn Freyssonnet-Inder" or other strings with spaces.

Would any of you know why javascript can't find and replace strings containing spaces in the url?

+1  A: 

You could generate a URL on the server side without the nom parameter instead of doing it in client-side JavaScript.

E.g., on the server side, lets say you received the request with nom & pays parameter; you could generate a link from server side code that excludes the pays parameter.

Isn't that straightforward to do? Let me know if I have misunderstood the question.

EDIT :

<a href="photos.php?pays="<%=variableForCountry%>" ...>link</a>

This is how it could be done in ASP. Sorry, I have not used PHP.

shahkalpesh
I recommend this approach, too. I know the question is about regexes, but generating strings from scratch is much, *much* simpler than munging existing ones.
Alan Moore
+6  A: 

In regular expression the plus sign (+) has special meaning - it means to repeat the previous item once or more times.

You'll need to escape the plus sign in order for it to represent the literal plus character:

criterionText = criterionText.replace(/\+/g, '\\+');
J-P
This is exactly what I was going to suggest, though I couldn't for the life of me remember the regex syntax in replace.
Joel Potter
Similarily to Borgar's answer (http://stackoverflow.com/questions/1314382/why-cant-javascript-find-and-replace-strings-containing-spaces-in-the-url/1314880#1314880), this doesn't seem to work in my situation
Shawn
+2  A: 

You have your script quite backwards actually. You're calling removeCriterion with the value for the field, but the regex is looking for '?' + criterionText, which will only match on the key for the key/value pair.

LorenVS
criterionText holds both the key and the value, for example: "nom=Shawn+Freyssonnet-Inder"
Shawn
+2  A: 

Add a regular expression escape function:

RegExp.escape = function ( s ) {
  return s.replace(/([.*+?^${}()|[\]\/\\])/g, '\\$1');
};

When building regular expressions from strings, you should escape the strings like this:

function removeCriterion(criterionText) {
    var getData = new RegExp("&" + RegExp.escape(criterionText) + "|\\?" +
                                   RegExp.escape(criterionText) + "$|" + 
                                   RegExp.escape(criterionText) + "&", "gi");
    window.location = window.location.toString().replace(getData,"");
}

Regular expression operators, such as plus, should now stop causing trouble.

Borgar
This particular solution doesn't seem to work in my case
Shawn
Ok it works now, I had to use javascript to simulate the php function urlencode so that it could find the string in the url. (I didn't know that $_GET automatically urldecode's...) Thank you very much for helping me solve this 2 week long problem :p
Shawn