Using Jquery to selecting an id with curly brackets

Question

I've got such a frustrating question for which I'm convinced there is an easy answer. Unfortunately I can't seem to find it anywhere: I have a table which I have no control over (SharePoint) and the table ID which has been allocated contains curly brackets:

eg <table id="{ACDC3234-D009-4889-931A-FCC069613AB6}-{EF2BF0FD-7927-4194-910F-0FE83EC4F118}"></table>

How can I select the table using JQuery whilst maintaining the brackets?

The code as it stands is:

    $(function(){

$('/{#{ACAC3258-D068-4799-931A-FCC069613AB6}-{EF2BF0FD-7927-4194-910F-0FE83EC4F118}}/').visualize({type: 'bar', width: '420px'});


});

I am trying to use JQuery Graphing Tool, Visualise.

Any help on this would be really greatly appreciated!

Many Thanks!

Answer 1

The simplest option is to call $(document.getElementById("{ACDC3234-D009-4889-931A-FCC069613AB6}-{EF2BF0FD-7927-4194-910F-0FE83EC4F118}")) .

You can also try escaping the braces with \ characters (which must themselves be escaped in the JS string literal):

$('#\\{ACDC3234-D009-4889-931A-FCC069613AB6\\}-\\{EF2BF0FD-7927-4194-910F-0FE83EC4F118\\}')

Answer 2

Since it's an invalid ID, you probably can't use the ID selector. This might work though:

$('table[id="{ACDC3234-D009-4889-931A-FCC069613AB6}-{EF2BF0FD-7927-4194-910F-0FE83EC4F118}"]')

Now you're using any-attribute-selector (whatever that's called). Since you can put anything in an attribute, you can (I think.) search for it.

Maybe jQuery won't allow it...

edit
jQuery 1.3.2 allows it: http://jsfiddle.net/rudiedirkx/VHpFb/

Answer 3

Just in addition, reading documentation helps:

If you wish to use any of the meta-characters ( such as ,"#$%&'()*+.:/;?<=>?@[\]^`{|}~ ) as a literal part of a name, you must escape the character with two backslashes: \\ .

Answer 4

That ID is invalid in HTML4 and for that reason you can't assume that every browser or tool will be able to process it.

From the spec :

ID and NAME tokens must begin with a letter ( [A-Za-z] ) and may be followed by any number of letters, digits ( [0-9] ), hyphens ( "-" ), underscores ( "_" ), colons ( ":" ), and periods ( "." ).

However, it's probably worth noting that HTML5 (which is partially a restandardisation of how existing browsers treat HTML) does remove those restrictions , so despite my warning it's likely that there is another solution which will work more often than not.