Author Topic: How to add a Datepicker Icon to a Zend_Form_Element?  (Read 1556 times)

0 Members and 1 Guest are viewing this topic.

Offline takeme2webTopic starter

  • Irregular
  • Posts: 8
    • View Profile
How to add a Datepicker Icon to a Zend_Form_Element?
« on: February 26, 2010, 03:29:39 PM »
Dear Experts,

I have a zend_form which contains a form element "customerdob" date of birth.  I want to add a datepicker icon next to this field, which when clicked on should execute a javascript to show the date picker.  I have the datepicker coming up currently "onfocus" on the "customerdob" field as shown below in my Zend_Form class;

   //add element:    effectivefromdate textbox
   $customerdob = $this->createElement('text', 'customerdob');
   $customerdob->setLabel('Date of Birth (yyyy-mm-dd):');
   $customerdob->setRequired(TRUE);
   $customerdob->addValidator(new Zend_Validate_Date('YYYY-MM-DD'));
   $customerdob->setAttrib('size', 20);
   $customerdob->setAttrib('onfocus', "javascript:NewCal('customerdob','YYYYMMDD')");
   $this->addElement($customerdob);

However, I want to add an icon next to the text field for the user's to click on it to get the datepicker.  Is this possible in Zend_Form? or should I go back to rendering individual fields in HTML viewscritps and adding the href tag to and image as shown below?

<input type="text" name="customerdob" id="customerdob" value="<?php echo date("Y-m-d", time()); ?>" size="12" />  <a href="javascript:NewCal('customerdob','YYYYMMDD')"><img src="/images/cal.gif" width="16" height="16" border="0" alt="Select a date"></a>

Please share your thoughts and help.

Regards
Takeme2web-Bala

Offline phpdeveloper82

  • Irregular
  • Posts: 45
    • View Profile
Re: How to add a Datepicker Icon to a Zend_Form_Element?
« Reply #1 on: March 01, 2010, 09:57:09 AM »

I don't know the step to show an image .. But you can create a Date Picker with JQuery easily. pls check the link:

http://stackoverflow.com/questions/1616857/best-way-to-start-using-jquery-in-a-zend-framework-1-9-application/2332904#2332904