datepicker error for escaped special character in element id

[[email protected]…]

I'm using jQuery in combination with JavaServer Faces and the element IDs generated by JSF have the form "[form name]:[id]" e.g. <input id="searchForm:outboundDate" type="text" name="outboundDate" />

These selectros were catered for in jQuery 1.1.3 by enabling the use of
to escape special characters.

Escape Selectors: A frequently requested feature you can now select elements by ID (or other selector) that uses a special character, for example this will find the div that has the ID of “foo.bar”: $("div#foo
.bar")

But when I use this form of selector with the datepicker I get the error "fn is not a funtion".

$("#searchForm
:outboundDate").datepicker({

showOn: "both", buttonImage: "#{request.contextPath}/images/icon/cal-popup.gif", buttonImageOnly: true

});

[kbwood]

Fixed. Now handles ids with embedded ':' or '.'.

The 'fn is not a function' error indicates that either jQuery or the plugin did not load properly.

[simone_b]

I'm still experiencing this issue in 1.6 b with jQuery 1.2.6 on an element with a dot in the id. The calendar slides down correctly, but when I do any action like selecting a day or changing month I get a "elem is undefined" somewhere in jquery script file.

Here's the markup:

<script type="text/javascript"> $(function() {

$("#Message
.DeliveryDate").datepicker();

}); </script>

<input id="Message.DeliveryDate" name="Message.DeliveryDate" type="text" value="01/01/0001 00:00:00" />

[simone_b]

Sorry, here's the right formatting.

<script type="text/javascript">
$(function() {
  $("#Message\\.DeliveryDate").datepicker();
});
</script>

<input id="Message.DeliveryDate" name="Message.DeliveryDate" type="text" />

[kazet]

I'm experiencing this issue with Datepicker 1.7.1 and jQuery 1.3.2 on an element with an ' / ' in ID.The calendar slides down correctly, but when I do any action like selecting a day or changing month I get a "Missing instance data for this datepicker" line 1279 in the jquery script.
Example

<script type="text/javascript">
$(function() {
  $("#attribute\\/name").datepicker();
});
</script>

<input id="attribute/name" name="attribute/name" type="text" />