Search code examples
phpmagentomagento-1.8

Magento Admin Grid Date Format

I'd like to be able to have a date/calendar selector in one of my admin grids when editing/adding an item. How do I code a calendar-style format?

I've tried changing the "format" parameter to "date" with no success.

I will include code and snapshots for clarification. Some of the code comes from the existing project, some comes from tutorials. I don't feel like a master of this code by any means, so any suggestions are welcome.

PHP 5.4.25 Magento 1.8.1.0

The search section on my index seems to be working:

grid index

But I'd like to change the text field for "close date" to a calendar-picker:

grid edit grid add

Here is my code for ../Party/Block/Adminhtml/Party/Edit/Tab/Form.php:

class Foobar_Party_Block_Adminhtml_Party_Edit_Tab_Form extends Mage_Adminhtml_Block_Widget_Form {

protected function _prepareForm() {

    $form = new Varien_Data_Form();
    $this->setForm($form);
    $fieldset = $form->addFieldset("party_form", array("legend" => Mage::helper("party")->__("Party information")));

    /* Code for other columns */

    $fieldset->addField("party_close_date", "date", array(
        "label" => Mage::helper("party")->__("Close Date"),

        'format' => 'date',
        'name' =>   'party_close_date',
        'time' =>   'true',
    ));

    if (Mage::getSingleton("adminhtml/session")->getPartyData()) {
        $form->setValues(Mage::getSingleton("adminhtml/session")->getPartyData());
        Mage::getSingleton("adminhtml/session")->setPartyData(null);
    } elseif (Mage::registry("party_data")) {
        $form->setValues(Mage::registry("party_data")->getData());
    }
    return parent::_prepareForm();
}

}

Here is my code for ../Party/Block/Adminhtml/Party/Edit/Form.php:

<?php

class Foobar_Party_Block_Adminhtml_Party_Edit_Form extends Mage_Adminhtml_Block_Widget_Form {

protected function _prepareForm() {
    $form = new Varien_Data_Form(array(
        "id" => "edit_form",
        "action" => $this->getUrl("*/*/save", array("id" => $this->getRequest()->getParam("id"))),
        "method" => "post",
        "enctype" => "multipart/form-data",
            )
    );
    $form->setUseContainer(true);
    $this->setForm($form);
    return parent::_prepareForm();
}

}

Here is my code for ../Party/Block/Adminhtml/Party/Grid.php:

<?php

class Foobar_Party_Block_Adminhtml_Party_Grid extends Mage_Adminhtml_Block_Widget_Grid {

public function __construct() {
    parent::__construct();
    $this->setId("partyGrid");
    $this->setDefaultDir("ASC");
    $this->setSaveParametersInSession(true);
}

protected function _prepareCollection() {
    $collection = Mage::getModel("party/party")->getCollection();
    $this->setCollection($collection);
    return parent::_prepareCollection();
}

protected function _prepareColumns() {

    /* Code for other columns */

    $this->addColumn("party_close_date", array(
        "header" => Mage::helper("party")->__("Close Date"),
        "type" =>   "datetime", 
        "index" =>  "party_close_data",
    ));

    $this->addExportType('*/*/exportCsv', Mage::helper('party')->__('CSV'));
    $this->addExportType('*/*/exportExcel', Mage::helper('party')->__('Excel'));

    return parent::_prepareColumns();
}

public function getRowUrl($row) {
    return $this->getUrl("*/*/edit", array("id" => $row->getId()));
}

}

Solution

  • I found the answer to my question!

    I added 3 lines to my ..Edit/Tab/Form.php file.

    I changed these lines...

            $fieldset->addField("party_close_date", "date", array(
        "label" => Mage::helper("party")->__("Close Date"),
        'format' => Mage::app()->getLocale()->getDateFormat(Mage_Core_Model_Locale::FORMAT_TYPE_SHORT),
        'name' =>   'party_close_date',
        'time' =>   'true',
    ));

    ...to this:

            $fieldset->addField("party_close_date", "date", array(
        "label" => Mage::helper("party")->__("Close Date"),
        'format' => Mage::app()->getLocale()->getDateFormat(Mage_Core_Model_Locale::FORMAT_TYPE_SHORT), 
        'after_element_html' => '<small>Comments</small>',
        'tabindex' => 1,
        'image' => $this->getSkinUrl('images/grid-cal.gif'),
        'name' =>   'party_close_date',
        'time' =>   'true',
    ));

    There's a handy tutorial here that helped me out loads.