How to do image uploader in the custom form field in magento 2 backend

Question

How to do image uploader in the custom form field in magento 2 backen

 _prepareForm()

$fieldset->addField(
            'proimage',
            'image',
            [
                'title' => __('Image'),
                'label' => __(' Image'),
                'name' => 'proimage',
                'note' => 'Allow image type: jpg, jpeg, gif, png',
            ]
        );

Save.php controller

 <?php

    namespace Cm\Productlabel\Controller\Adminhtml\Label;
    use Magento\Backend\App\Action;
    use Magento\Framework\App\Filesystem\DirectoryList;

    class Save extends Action
    {
        /**
         * @param Action\Context $context
         */

        public function __construct(
          Action\Context $context,
       )
        {
            parent::__construct($context);

        }


        protected function _isAllowed()
        {
            return $this->_authorization->isAllowed('Cm_Productlabel::save');
        }


       public function execute()
       {
          $isPost = $this->getRequest()->getPost();
          $resultRedirect = $this->resultRedirectFactory->create();
          if ($isPost) {
                $model = $this->_objectManager- 
              >create('Cm\Productlabel\Model\Productlabel');
             $postId = $this->getRequest()->getParam('productlabel_id');

             if ($postId) {
                $model->load($postId);
             }
            $profileImage = $this->getRequest()->getFiles('proimage');
       $fileName = ($profileImage && array_key_exists('name', $profileImage)) ? 
        $profileImage['name'] : null;
    if ($profileImage && $fileName) {
        try {


            $uploader = $this->_objectManager->create(
                'Magento\MediaStorage\Model\File\Uploader',
                ['fileId' => 'proimage']
            );
            $uploader->setAllowedExtensions(['jpg', 'jpeg', 'gif', 'png']);
            /** @var \Magento\Framework\Image\Adapter\AdapterInterface 
          $imageAdapterFactory */
            $imageAdapterFactory = $this->_objectManager- 
           >get('Magento\Framework\Image\AdapterFactory')
                ->create();
            $uploader->setAllowRenameFiles(true);
            $uploader->setFilesDispersion(true);
            $uploader->setAllowCreateFolders(true);
            /** @var \Magento\Framework\Filesystem\Directory\Read 
             $mediaDirectory */
            $mediaDirectory = $this->_objectManager- 
                  >get('Magento\Framework\Filesystem')
                ->getDirectoryRead(DirectoryList::MEDIA);

            $result = $uploader->save(
                $mediaDirectory
                    ->getAbsolutePath('Bootsgrid/Productlabel')
            );
            //$data['profile'] = 'Modulename/Profile/'. $result['file'];
            $model->setProimage('Bootsgrid/Productlabel'.$result['file']); / 
            /Database field name
        } catch (\Exception $e) {
            if ($e->getCode() == 0) {
                $this->messageManager->addError($e->getMessage());
            }
          }
          }

             $formData = $this->getRequest()->getParam('label');
             $model->setData($formData);

             try {

                // Save news
                $model->save();

                // Display success message
                $this->messageManager->addSuccess(__('The post has been 
                 saved.'));

                // Check if 'Save and Continue'
                if ($this->getRequest()->getParam('back')) {
                   $this->_redirect('*/*/edit', ['id' => $model->getId(), 
               '_current' => true]);
                   return;
                }

                // Go to grid page
                $this->_redirect('*/*/');
                return;
             } catch (\Exception $e) {
                $this->messageManager->addError($e->getMessage());
             }

             $this->_getSession()->setFormData($formData);
             $this->_redirect('*/*/edit', ['id' => $postId]);
          }
       }

    }

Possible duplicate of Magento2 : Admin module Image upload code to display form — Jaimin Sutariya, Apr 11 '19 at 06:34
i used it but uploaded image not saved in database, i m looking forward into the issue @rakesh — Divya Sekar, Apr 11 '19 at 08:48

score 3 · Accepted Answer · answered Apr 11 '19 at 06:13

3

Add Below code in n _prepareForm() function inside

app/code/Vendor/Module/Block/Adminhtml/Module/Edit/Tab/Main.php

$fieldset->addField(
    'profile',
    'image',
    [
        'name' => 'profile',
        'label' => __('Profile Image'),
        'title' => __('Profile Image'),
        'required'  => false,
        'disabled' => $isElementDisabled
    ]
);

Now in execute() method of your save controller file. use below code to save and upload image.

app/code/Vendor/Module/Controller/Adminhtml/Index/Save.php

use Magento\Framework\App\Filesystem\DirectoryList;

$profileImage = $this->getRequest()->getFiles('profile');
$fileName = ($profileImage && array_key_exists('name', $profileImage)) ? $profileImage['name'] : null;
if ($profileImage && $fileName) {
    try {
        /** @var \Magento\Framework\ObjectManagerInterface $uploader */
        $uploader = $this->_objectManager->create(
            'Magento\MediaStorage\Model\File\Uploader',
            ['fileId' => 'profile']
        );
        $uploader->setAllowedExtensions(['jpg', 'jpeg', 'gif', 'png']);
        /** @var \Magento\Framework\Image\Adapter\AdapterInterface $imageAdapterFactory */
        $imageAdapterFactory = $this->_objectManager->get('Magento\Framework\Image\AdapterFactory')
            ->create();
        $uploader->setAllowRenameFiles(true);
        $uploader->setFilesDispersion(true);
        $uploader->setAllowCreateFolders(true);
        /** @var \Magento\Framework\Filesystem\Directory\Read $mediaDirectory */
        $mediaDirectory = $this->_objectManager->get('Magento\Framework\Filesystem')
            ->getDirectoryRead(DirectoryList::MEDIA);

        $result = $uploader->save(
            $mediaDirectory
                ->getAbsolutePath('Modulename/Profile')
        );
        //$data['profile'] = 'Modulename/Profile/'. $result['file'];
        $model->setProfile('Modulename/Profile'.$result['file']); //Database field name
    } catch (\Exception $e) {
        if ($e->getCode() == 0) {
            $this->messageManager->addError($e->getMessage());
        }
    }
}

And Image showing in grid follow this link : Reference

answered Apr 11 '19 at 06:13

Rakesh Donga

5,344
2
24
57

when i save a image, in save.php controller file i get a null value prnt.sc/nag0sd @rakesh – Divya Sekar Apr 11 '19 at 09:06
i used a var_dump() function it reflects null prnt.sc/nag2ni @rakesh – Divya Sekar Apr 11 '19 at 09:06
its not working – Divya Sekar Apr 11 '19 at 10:46
@divyasekar it is working code i have many time used you are small mistake any where – Rakesh Donga Apr 11 '19 at 10:50
wait i will post a code – Divya Sekar Apr 11 '19 at 10:51
please check a above code – Divya Sekar Apr 11 '19 at 10:58
image not saved in db https://prnt.sc/nai3ah – Divya Sekar Apr 11 '19 at 11:16
Sorry for late reply. Cannot reach to my working laptop. I will process this issue when I be able to – Rakesh Donga Apr 11 '19 at 11:19
thats no problem @rakesh – Divya Sekar Apr 11 '19 at 11:20
above code works fine but in a admin custom form i edit the content after saved in database image field store as blank after edit and update a admin form – Divya Sekar Apr 12 '19 at 11:25
@divyasekar sorry for late replay but it is very easy code above you have small mistake any where you can debugging step by step – Rakesh Donga Apr 13 '19 at 04:28
its working fine upload image and saved into db @rakesh but after edit a form and saved into db image field become after edit (update and saved) – Divya Sekar Apr 13 '19 at 04:52
I got this error : Fatal error: Uncaught Error: Call to a member function getAbsolutePath() on string..... – Chirag Parmar Jan 17 '20 at 11:43

How to do image uploader in the custom form field in magento 2 backend

1 Answers1

Linked