Add custom input fields on Admin html forms in Magento

16 Jul 2009

Adding a custom input type on the forms on Admin html is very easy.

I used this in the module which I created with Module Creator.
I supposed to show the uploaded image on the edit form on Admin. The images are uploaded by the user from the front end.

For displaying the thumbnail, by default there is no way in Magento.
So I created a new class ‘Varien_Data_Form_Element_Thumbnail’ & named it Thumbnail.php.

class Varien_Data_Form_Element_Thumbnail extends Varien_Data_Form_Element_Abstract
{
    public function __construct($data)
    {
        parent::__construct($data);
        $this->setType('file');
    }

    public function getElementHtml()
    {
        $html = '';

        if ($this->getValue()) {
            $url = $this->_getUrl();

            if( !preg_match("/^http\:\/\/|https\:\/\//", $url) ) {
                $url = Mage::getBaseUrl('media') . $url;
            }

            $html = ' ';
        }
        $this->setClass('input-file');
        $html.= parent::getElementHtml();

        return $html;
    }

    protected function _getUrl()
    {
        return $this->getValue();
    }

    public function getName()
    {
        return  $this->getData('name');
    }
}

Copy the file at ‘/lib/Varien/Data/Form/Element/’.

To Display the thumbnail, inside the function _prepareForm() write the code below. (In my case I edited the file.. ‘app/code/local/Mage/Modulename/Block/Adminhtml/Modulename/Edit/Tab/Form.php’. This module was created with Module Creator)

$form = new Varien_Data_Form();
      $this->setForm($form);
      $fieldset = $form->addFieldset('modulename_form', array('legend'=>Mage::helper('modulename')->__('Module information')));
      $tempArray = array(
	          'label'     => Mage::helper('arequets')->__('Sample Work'),
	          'name'      => 'samplefilename',
	          'style'     => 'display:none;',
		  );
      $fieldset->addField('samplefilename', 'thumbnail',$tempArray);

Here, ‘samplefilename’ should be the path of the thumbnail.

16 Responses to Add custom input fields on Admin html forms in Magento

AlexAxe

July 25th, 2009 at 12:39 am

Hi, Where are you from? Is it a secret?
Thank you
AlexAxe

admin

July 25th, 2009 at 2:52 pm

Hi,

I am Jignesh. From India & I am a Web Developer.
Having expertise on PHP, JS & also Magento these days..

jara

August 19th, 2009 at 4:57 pm

Hi,
How to add this comment form to my website in magento.

admin

August 19th, 2009 at 5:29 pm

Hello Jara,
Please let me know, about which comment form you are asking?

jara

August 22nd, 2009 at 6:17 pm

The comment Form which we are using to communicate,I want to add this to my website i am using magento .1.3.2.3

admin

August 22nd, 2009 at 6:20 pm

This comment form is in this Blog setup. It can’t be added to the Magento. This site is not based on Magento.

Andy

August 26th, 2009 at 2:46 am

Hello Jignesh,

Thanks for the post. I have a question.

If we copy the file to ‘/lib/Varien/Data/Form/Element/’, won’t it be affected during an upgrade of Magento? Or is there another path that we can put?

I’m also guessing that it may not be affected since we are creating an entirely new file, but not sure.. hmmm…

Best.

admin

August 26th, 2009 at 10:28 am

Andy,
You are correct I guess. During the upgrade new files created won’t be affected.
Still its good to take backups before upgrade.

Ronald

October 1st, 2009 at 2:58 pm

Hi Jignesh, great tutorial there..
i need some enlighment here. Currently i want to add a custom textbox on checkout page for each item ordered, and save the input on my newly added field (added to sales_flat_order_item table, lets say “myCustomField”).
i have no idea on how can i get the content from each input, and save it to the field.
I already done the “textbox for each item” thing, but save it?? almost impossible for me..

please help, or perhaps you can mail me instead..
appreciated it much… thanks

chandresh

January 13th, 2010 at 4:45 pm

I want to put one textbox on add cart button page

when user add any text in text box ,the value should be seen in whatever nextpage
and next page is checkout

so could you please help me how can i put one text box and redirect its value

Regards,
Chandresh

sweeper

January 29th, 2010 at 3:30 pm

Can I add another form, like the existing contact us page, which simply grabs all the submitted information and sends an email to a given admin email address? This is needed as product warranty registration page in frontend.

admin

January 29th, 2010 at 3:50 pm

@sweeper, you can create a new custom module, using so called a ‘moduleCreator’.
Then you can modify the files to achieve your goals.