version 1.3.0 checkboxes are not displayed when id has '[' character - selectors not escaped properly

[dev-blanked]

Using jQuery mobile 1.3.0 checkboxes are not displayed properly when the id of the check box contains '[' character. This worked perfectly well with 1.2.0 version.

Please take a look at http://jsfiddle.net/rZDWF/2/

Here is the JS Bin stuff http://jsbin.com/onipem/2/edit

[jaspermdegroot]

@dev-blanked

This is a 1.2.0 test page: http://jsbin.com/ayumal/8/edit. It doesn't throw an error but the checkbox isn't enhanced either. The reason you get an error with 1.3.0 has not to do with changes in jQuery Mobile, but the different jQuery core version you are using (the error is only with core >= 1.8.x).

I guess we would have to look for square brackets, dots and colons in ID's and escape them with double backslash to prevent this problem.

[dev-blanked]

Is it possible to use jQuery mobile 1.3.0 with jQuery core < 1.8 ? or does this mean I simply can't use jQuery mobile 1.3.0 because of this issue ?

[jaspermdegroot]

@dev-blanked

In my previous comment I said "It doesn't throw an error but the checkbox isn't enhanced either". I just noticed that was only because the ID of the label and input were not the same on your test page ("Q" missing).
You can use jQuery Mobile 1.3.x with jQuery core 1.7.2: http://jsbin.com/ayumal/12/edit

Now I know that it use to work I am not sure anymore if this is a jQuery Mobile issue or a bug in core's Sizzle selectors engine.

[gibson042]

This issue stems from the unescaped input[0].id in checkboxradio.js.

[dev-blanked]

jQuery core thinks this is not a bug in the core. Please refer http://bugs.jquery.com/ticket/13968

Are you guys planning to fix jQuery mobile ?

[jaspermdegroot]

@dev-blanked - Yes.

@gibson042 - Thanks for the pointer!

[dev-blanked]

@uGoMobi great!!!.

Also please note that the issue might not specific to checkboxes and might come up in other places also

[jaspermdegroot]

@dev-blanked

Yeah, was thinking about that too. So far I couldn't think of a widget where we look for an ID except navigation (changePage). Not sure if the same issue can occur there.

cc: @johnbender

[dmethvin]

@dev-blanked the continuing discussion here is pretty clear that the bug is in Mobile so I am not sure why you just posted in the core bug tracker. @gibson042 points out the line in checkboxradio.js where the problem lies due to the unescaped id in .filter( "[for='" + input[0].id + "']" ). That string either needs to be escaped like the fiddle shows, or it could be changed to a filter function doing a similar operation (checking the label's for attribute against the element's id attribute).

[jaspermdegroot]

I think I caused the confusion with my second comment, sorry. I already thought we have to fix this in jQuery Mobile by escaping brackets (see my first comment). It was only because the error doesn't occur with core < 1.8 that I was in doubt for a moment.