Javascript - Uncaught Error: Syntax error, unrecognized expression

Question

Edit: I think the issue is not with concatenation itself but the special character in the id of the element I am trying to select.

Original:

I am having problem with concatenating two strings. It seems the problem is because one of the strings contains '!'. Sadly, I have no control over what that string can contain. I tried using '+' to make single string of the two before I tried concat(). But the error remains the same.

The relevant code is $('#id_online_status_'.concat(msg.id)).removeClass('text-success').addClass('text-muted');

Error is this:

Uncaught Error: Syntax error, unrecognized expression: #id_online_status_specific.YqzvRnpU!OPMxkuoFQILY

Please help with fixing this. I am not much familiar with JS in general.

The concat is fine but you're trying to select an id with an `!` character which is illegal. Here's a [mcve] of your problem: `$("#!")`. — ggorlen, Aug 14 '20 at 05:42
or this: https://stackoverflow.com/questions/2786538/need-to-escape-a-special-character-in-a-jquery-selector-string — mplungjan, Aug 14 '20 at 05:55
This should help you: $('#id_online_status_'.concat(msg.id.replace(/([!"#$%&'()*+,./:;<=>?@[\]^`{|}~])/g, '\\$1'))).removeClass('text-success').addClass('text-muted'); — hgb123, Aug 14 '20 at 05:58

score 0 · Answer 1 · answered Aug 14 '20 at 05:46

0

change your code like this and try

$('#id_online_status_'+msg.id).removeClass('text-success').addClass('text-muted');

remove 'concat' and try with (+)

answered Aug 14 '20 at 05:46

Kavindu Chathuranga

222
1
14

1

The issue is special char in the selector – mplungjan Aug 14 '20 at 05:48
_I tried using '+' to make single string of the two before I tried concat(). But the error remains the same._ – mplungjan Aug 14 '20 at 05:50
yes. but we can resolve the issue remove concat() and replace it with + mark – Kavindu Chathuranga Aug 14 '20 at 05:50
send me, how you tried it with + mark ?? – Kavindu Chathuranga Aug 14 '20 at 05:52
2

It is not my question. The problem is ? `id="id_online_status_123!456"` cannot be selected using a selector like yours – mplungjan Aug 14 '20 at 05:53
https://stackoverflow.com/questions/2786538/need-to-escape-a-special-character-in-a-jquery-selector-string – mplungjan Aug 14 '20 at 05:54
I used `'#id_online_status_'+msg.id` before. But @mplungjan is right. The issue seems to be with element id having special character in it. I will edit the pots. – Newbie Aug 14 '20 at 05:55
1

I think this explains the error https://stackoverflow.com/questions/70579/what-are-valid-values-for-the-id-attribute-in-html – Newbie Aug 14 '20 at 06:04
mmm yes. the error comes with an Exclamation mark. don't use the unsafe characters for best practices. Thanks @Newbie – Kavindu Chathuranga Aug 14 '20 at 06:04
@Newbie Your link is already used to close this question as dupe – mplungjan Aug 14 '20 at 06:10
@KavinduChathuranga If you delete your answer, OP can delete the question – mplungjan Aug 14 '20 at 06:10
I think the discussion will be useful for another developer. – Kavindu Chathuranga Aug 14 '20 at 06:13
1

I ended up using `attr("data-status-userid", user.id);` to do what I wanted to do with elements ID. This resolve my original issue. In the end I wanted uniqueness of the elements. So setting attr gives me that. Thank you all who tried to help. I appreciate it. – Newbie Aug 14 '20 at 07:14

Javascript - Uncaught Error: Syntax error, unrecognized expression

1 Answers1