CODEWITHSUNDEEP
javascriptjquerymagento
pedropeixoto
pedropeixoto

Reputation: 1633

Uncaught Error: Syntax error, unrecognized expression. Escaping characters?

I'm trying to show a div element with the id "online-payments" if a specific radio box is selected during the checkout process.

So far I have the following:

<div id="online-payments" style="display: none;">
    Test
</div>

And for the javascript:

jQuery(document).ready(function(){
jQuery("radio[@name='payment\[method\]']").click(function(){
if (jQuery("radio[@name='payment\[method\]']:checked").val() == 'checkmo')
jQuery("#online-payments").show();
});
});

This is a Magento store so im using the no-conflict mode because of the prototype libraries.

The problem comes down to the radio's name. It's payment[method] by default on Magento (I've tried to change it, but it looks like it would give me more work than I had anticipated).

So it really comes down to escaping those brackets [ ], which I thought I did, but even then it's throwing me this error:

Uncaught Error: Syntax error, unrecognized expression: radio[@name='payment[method]']

What's wrong here?

Upvotes: 0

Views: 1415

Answers (1)

T.J. Crowder
T.J. Crowder

Reputation: 1074425

Several problems there:

  1. You're using an attribute selector, but with an invalid name (@name). Attribute names cannot start with @.

  2. There's also no need for the backslashes as long as you use quotes (which you are, single quotes are fine). (And the ones you have aren't ending up as part of the selector, to put a backslash in a selector when the selector is in a JavaScript string, you have to escape the backslash as \\.)

  3. radio isn't a tag name.

Perhaps you wanted:

jQuery("input[type=radio][name='payment[method]']")

jQuery offers an extension which is :radio, but using it isn't recommended, for the reasons discussed on its API page (basically, jQuery can't hand it off to the browser's native querySelector / querySelectorAll).

Upvotes: 4

Related Questions