Spry Date Hints COLLIDE With Dynarch Calendar Widget

I finally added a calendar widget to the onTap framework -- which is actually something I'd been planning to do for a while and just hadn't got around to. I ended up finally doing it simply because I was asked to implement a "date picker" in a project I'm working on and as long as I was implementing it there, I figured I may as well get around to implementing it in the framework as well.

What I didn't realize is that there was going to be a problem with Spry that would cause me several hours of hair pulling (at the office, I don't use Spry in the framework). Google of course was no help.

It turns out, the Spry ValidationTextField widget has a "hint" property for validation of dates. In the Spry examples it's typically set to the same value as the "format" property i.e. "mm/dd/yyyy" for US dates. So the Spry code to create the validation widget looks like this:

<script>
   new Spry.Widget.ValidationTextField([inputID], "date", {
      format:"mm/dd/yyyy",
      hint:"mm/dd/yyyy",
      useCharacterMasking:true });
</script>

And the Dynarch code to create the Calendar widget looks like this:

<script>
   Calendar.setup( {
      inputField : [inputID], // ID of the input field
      ifFormat : "%m/%d/%Y", // the date format
      button : [buttonID] // ID of the button    } );
</script>

And what happens is that when someone uses the Calendar to select a date, even though the format of the returned date form the calendar is correct, the Spry widget fails validation. Oddly enough, the trick to get this working is to remove the hint property when you create the Spry widget.

Hopefully this will help a few folks and they may not have to go through the hair-pulling I went through to figure it out. There's a sample html template attached to this blog containing the complete setup to demonstrate how the hint property fouls up the Spry validation after the calendar is used to select a date.

Comments
Esther's Gravatar How can I get the JavaScript for this? The zip just contains the html ;-?
# Posted By Esther | 6/24/08 2:57 AM
ike's Gravatar Sorry esther ... the Dynarch Calendar library you can get from the Dynarch site at http://www.dynarch.com/projects/calendar/ - the Spry library you can get from the Adobe Labs site for Spry http://labs.adobe.com/technologies/spry/home.html
# Posted By ike | 6/24/08 9:09 AM
BlogCFC was created by Raymond Camden. This blog is running version 5.5.006.