JQuery selector problem - 'Syntax error, unrecognized expression' fix

Posted At : March 12, 2009 3:55 PM | Posted By : James Allen
Related Categories: JQuery

I just spent a little time wrestling with an annoying JQuery error when trying to select a form element by name.

I was using the following code to simply grab the contents of a hidden field named 'required':

var req = $("input[@name=required]").val();

I got this syntax from a quick google search and found it referenced on a number of web guides about JQuery.

However, when I used it I got the following error in Firefox:

'Syntax error, unrecognized expression: [@name=required]' when calling method: ..... '

Well after some head scratching and then some more searching I found the answer. The @ syntax is no longer supported in JQuery 1.3+.

So the simple fix is to just remove the @ and it'll work as expected:

var req = $("input[name=required]").val();

Hopefully this will help someone who, like me, hit's Google when looking for a quick fix to a problem.. :)

Comments (43) |

Send |

del.icio.us |

Digg It! |

Linking Blogs | 53644 Views

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)

[Add Comment]

Thanks for this post... right at the top of my google search... saved me alot of time.

# Posted By Adam | 3/18/09 9:53 AM

Hey there Adam,
Thanks for your comment and glad you were able to find the answer to this issue quickly. I like being able to hit Google when I get an error and get the answer straight away. No hassle and then we can get right back to the creative part of our job. :)

# Posted By James Allen | 3/18/09 10:41 AM

Hi..

Thanks too. But, we have to change 493 errors regarding '@'. Are you sure, there's nothing will happen?

# Posted By hudz | 3/21/09 10:33 AM

Yeah it should be fine, just be careful with your search and replace pattern - if you're doing a bulk change - so that you don't replace anything you shouldn't.

The @name syntax is certainly not supported anymore so replacing '@name' for 'name' should do the trick.

My advise is to first take a full copy of the site and then do the global search and replace. Test the site and if there are any problems roll back. Do it locally first if you can.

# Posted By James Allen | 3/21/09 12:54 PM

Thanks a mil James! I recently updated to jQuery 1.3.2 and was baffled why my stuff was breaking all of a sudden. Your post helped me get it straightened out quickly

# Posted By Brian FitzGerald | 4/10/09 11:05 PM

Hey there Brian. Absolutely no problem - glad I could help. As soon as I found the solution I thought I'd get it posted as I knew others would come across it. One of those really annoying problems that isn't immediately obviously unless scouring the release notes which we don't always have the time to read (I tend to just keep on updating and usually things don't break). Well, as long as we all post up these things when we discover them the solutions will be available to everyone without too much hassle.. Gotta love the Internet. :)

# Posted By James Allen | 4/11/09 2:21 AM

Thank you very much, saved me a lot of time :-)

# Posted By Elmer | 4/26/09 7:35 AM

This post saved me a lot of headache. I had found an older code sample and was baffled as to why it wasn't working in my app when other selector statements were fine.

Thanks!

~Doug

# Posted By Doug B | 4/30/09 4:35 PM

Hey no problem Doug. I was in the exact same position as some code I found had the @ reference in it so I couldn't figure out what was wrong. Glad this saved you some time.

# Posted By James Allen | 4/30/09 6:03 PM

Yup, googled and this page was #1 for this problem. Thanks for posting it here!

# Posted By Adam | 5/7/09 12:49 PM

Hey there Adam,
Excellent. Glad to know it was able to help you out quickly. Nothing better than finding the answer to a creativity destroying problem at the number slot on good old Google.

# Posted By James Allen | 5/7/09 5:11 PM

Thanks man, nice to share knowledge and save us some time

# Posted By Erick | 5/15/09 11:03 PM

Hey no problem,
Thanks for taking the time to comment.
Nice to know this is helping people. The quicker this kind of problem is solved the better in this game.

# Posted By James Allen | 5/18/09 4:52 PM

Thanks for the entry... it was the second result of my Google search and saved me the rest of my afternoon (though I already spent about 2 hours trying to track this down). I guess that's what I get for keeping inconsistent versions of jQuery between the various projects I'm working on. The '@' syntax was working perfectly for me on another site, so I was losing my mind!

# Posted By Kirk | 6/4/09 10:16 PM

I know just what you mean! I hate those kind of inconsistencies - they can truly melt your brain. Annoying that they suddenly removed syntax which had worked for months. Just glad I was able to provide the answer for you.. Took me a while to track it down..

# Posted By James Allen | 6/4/09 11:30 PM

Thanks you just save me a lot of time.

# Posted By Patrice Fiset | 6/23/09 1:50 AM

My pleasure Patrice.

# Posted By James Allen | 6/30/09 12:52 PM

Just like everyone else, I landed from Google searching for a solution to this problem. I was upgrading jQuery from 1.2.6 to 1.3.2. Removed the @s and everything worked again. Thank you, James!

# Posted By Martín | 6/30/09 4:36 PM

Awesome Martin! Quick Google solutions are the best...

# Posted By James Allen | 6/30/09 11:48 PM

Ah, this was killing me for an entire afternoon. I wish I searched earlier. This was at the top of Google's results. Thanks!

# Posted By Brian | 7/21/09 9:04 PM

@Brian,
Hey no probs - glad I could help. Thanks for posting.

# Posted By James Allen | 7/21/09 9:25 PM

Same here. This was killing me - I had some sample jQuery that should _just work_, but got this error. It looked fine according to the official jQuery 1.2 docs still on the jQuery site, but I finally landed on your page for the fix. I did finally find reference to this here:

http://docs.jquery.com/Selectors

Still, seems like they should have a breaking change like that in blinking red all over their site =)

# Posted By Daniel | 7/22/09 12:29 AM

Yeah that's what happened to me. The code I had should have worked fine but kept failing with that annoying message. It's at times like that where you start to question your whole code base and start debugging *everything*. Doesn't cross your mind that it might be the actual framework. Totally agree with you - a change as fundamental as that should be VERY clear or have a built in error message if possible.

# Posted By James Allen | 7/22/09 12:33 AM

Hey, thank's a lot man, this was awesome, saved me from lot of issues.

# Posted By Jana Fioravanti | 1/6/10 8:04 PM

Many Thank,

the first search Result in search Engine show me this Answer :)

# Posted By Jörg Rostock | 1/15/10 7:16 PM

Thanks. saved lots of my time.

# Posted By kiran | 1/25/10 6:00 PM

Thanks! Exactly the fix I was looking for.

# Posted By Catherine G | 2/25/10 3:36 AM

Same comment as everyone else! Thanks for posting this!

# Posted By Jason B | 5/20/10 1:15 AM

Thanks for posting!!

# Posted By Gopal | 6/17/10 6:28 AM

Hi, I am having trouble in the same location of the Jquery code. However it is with the class name. My Img tag has multiple class names associated with it, so the class list appears as

".nowrap destFolder"

I keep getting the error - Uncaught Exception: Syntax error, unrecognized expression: 'destFolder'

This exception happens for the second class name, and is thrown from the Sizzle.filter function on line 1579.

I would definitely appreciate any help or information regarding if there was a change in syntax for class names. Thank you

Amar

# Posted By Amar | 10/4/10 10:09 PM

Hi there Amar,
Sorry for the delay in replying.

Did you fix this issue? I'm not quite sure what might be causing it but I don't think it's related to the @ problem.

I would be interested to hear what the problem was though if you resolved it.

# Posted By James Allen | 10/17/10 3:30 PM

Thanks!

# Posted By Fábio | 1/14/11 2:03 PM

-@Amar,
It appears that you have a miss-placed "." the . is not allowed at the beginning of class names in html, only neccassary in CSS.

On another note, you may get this error even if you have not recently upgraded or do not use the @ sign.
I am recieving this error with this line of code pop = $("#" + sID + "_popup").length;
Apparantly somewhere I am setting this to an object, so when I go to use it here it is not a string; I am not sure where or why.. Just an FYI on this error

# Posted By Steve | 2/1/11 5:09 PM

thanks man, thought I was going nuts.................

# Posted By derrick | 2/23/11 12:45 AM

You sir, rock my socks.

# Posted By Koz | 3/30/11 8:20 PM

This was top Google hit for my problem, the complaint was about 'select'. In this case I mistyped ' option:selected' without the 'ed' which caused jQuery to throw this exception. Changing 'select' to 'selected' (to get the selected dropdown option) fixed this.

# Posted By Jason Hooper | 4/25/11 5:25 AM

If you find this with "unrecognised expression: >', check your variables.
Had an issue where I was using data returned from a form (using mysql_insert_id() in php) to call an ajax function on success.
As far as I could tell it was just returning '123' which was an ID to be used in the jquery load() function (e.g. mypage?id=123)
Code:
var theID = $.trim(data);
$('#container').load('mypage.php?id='+theID);

The problem I had was that when the initial page was run (to insert a value and then return its ID via "echo mysql_insert_id") it didn't just echo '123'.
Because of the way I had placed the code what it was actually returning was "123 </body></html>" which, according to the code above, resulted in:
.load('mypage.php?id='+'123</body></html>'.
Moving my returned data to a better location removed the issue.
Just spent over an hour fixing this - hope it helps someone else!

# Posted By Toby | 10/31/11 3:47 PM

Phew, nice! Thanks alot!

# Posted By Heidelberg | 1/24/12 8:27 AM

So many thanks!!!!! I was trying to work out my new festive jquery calendar with an old jquery form and I couldn't find out why I couldn't get out the errors list with
$("label[@for="+error_encontrado.id+"]").before("<p class='error'>"+error_encontrado.msg+"</p>");
I just put off the@ and it worked.
Thanks again.

# Posted By Angelica | 2/1/12 10:34 AM

Thanks for taking the time to post Angelica - glad this helped you sort out the problem. Always annoying when things don't work that look like they should.

@Toby - great tip there, thanks for that.

# Posted By James Allen | 2/1/12 1:15 PM

hi i am having the same problem but cant fix it as the names of the radio inputs i am using are in array style e.g payment_options[] , and was previously using the following code to check if any of the two raio button is selected .
if(jQuery("input:radio[name=payment_option[]]:checked").length==0){
str+='Please Select a Payment option\n';
}

but now it gives me error whenever i try to add the square brackets "[]" with the name can any one tell me how should i check this

# Posted By omer | 1/8/13 11:15 AM

Hi Omer and others,

try this:

$('input:radio[name="payment_option[]"]:checked')... I guess it should do the trick... the issue is the simple and double quotes

# Posted By Alfred Antoine | 2/27/13 2:09 PM

var $dateObje = $(s)

wher s is html code getting from ajax response.

In fireFox getting the above error

# Posted By Santosh | 4/24/13 3:14 PM

[Add Comment]