jQuery: datepicker - Calendar activated by the icon and the date field at the same time

I've already lo开发者_如何学Coked around but couldn't find the exact solution/problem I'm having right now.

All I want is to have the calendar appear either by clicking on the calendar icon AND from the text field in which the date appears when selecting a date. Right now, after trying different properties, I can only have the calendar appear by one or the other, but not both: the icon and the field.

This is the code I'm using to activate it via the icon:

$("#datepicker").datepicker({
   showOn: 'button',
   buttonImage: 'images/icon-calendar.gif',
   buttonImageOnly: true,
   changeMonth: true,
   changeYear: true,
   showAnim: 'slideDown',
   duration: 'fast'
});

Is there a way to have the calendar appear by clicking on the icon AND the field as well?

Thanks.

This is the working code to make the calendar appear when clicking on the icon AND on the date field, notice the "both" value:

$("#datepicker").datepicker({
 showOn: 'both',
 buttonImage: 'images/icon-calendar.gif',
 buttonImageOnly: true,
 changeMonth: true,
 changeYear: true,
 showAnim: 'slideDown',
 duration: 'fast'
});

Thanks to derek for his help.

try setting: showOn: 'both'

Give your date picker field an id and try this:

<input type="text" name"whatever" id="datepickerfield" />

For the field:

$("#datepickerfield").datepicker({
 showOn: 'button',
 buttonImage: 'images/icon-calendar.gif',
 buttonImageOnly: true,
 changeMonth: true,
 changeYear: true,
 showAnim: 'slideDown',
 duration: 'fast'
});