Jul
16
2009

Add custom input fields on Admin html forms in Magento

An article by admin

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.

About the Author: Jignesh Patel

Jignesh Patel is a geek, an engineer & a web developer, who focus on developing web sites which look great, work great and can still work on older web browsers. Expertise in PHP, MySQL, JS, Magento & Wordpress.

View Comments + Add Comment

Anonymous August 13, 2010 at 4:29 am

Hello jara,
If you are talkin about the current comment system, then its ‘DISQUS comment system’.

Reply
kurt April 7, 2010 at 2:59 pm

can i look the output of this code?

Reply
Sumanta Pati February 23, 2010 at 4:36 pm

How to upload images by the user from the front end ?
Please Help…

Reply
sweeper January 29, 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.

Reply
- admin January 29, 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.
  
  Reply
chandresh January 13, 2010 at 4:45 pm

Hi

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

Reply
Ronald October 1, 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

Reply
mcdonalds coupons September 14, 2009 at 3:27 am

Thanks very much for this nicely written post.

Reply
Andy August 26, 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.

Reply
- admin August 26, 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.
  
  Reply
jara August 22, 2009 at 6:26 pm

ok thank you..

Reply
jara August 22, 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

Reply
- admin August 22, 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.
  
  Reply
jara August 19, 2009 at 4:57 pm

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

Reply
- admin August 19, 2009 at 5:29 pm
  
  Hello Jara,
  Please let me know, about which comment form you are asking?
  
  Reply
AlexAxe July 25, 2009 at 12:39 am

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

Reply
- admin July 25, 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..
  
  Reply