[PS 1.7.6.5] ajax image upload and save in module

[Guest]

I have a problem saving an image in my module.

I need to load an image into the html form in the module configuration and save it using JavaScript.

Can you give me an example of how you handle it?

Thank you experienced for the advice.

 

public function postProcess()
    {      
            if(Tools::isSubmit('save_post_name')){
                    $this->makeUpload($_FILES['file']);
            }				
           
    }
    
    public function makeUpload($file){
        if(!empty($file)){   
          $file_name = $file['name'];
          $rand_number = rand(0, 900);
          $temp = $file['tmp_name'];
          if ($error = ImageManager::validateUpload($file)) {
            return $error;
          } else {
                $ext = substr($file_name, strrpos($file_name, '.') + 1);
            $file_name = substr($file_name,0,strrpos($file_name,'.'));
                  $file_name = $file_name.'.'.$ext; 
            if (!file_exists(_PS_MODULE_DIR_.$this->name.'/upload')) {
                mkdir(_PS_MODULE_DIR_.$this->name.'/upload', 0777, true);
            }
            if (!move_uploaded_file($temp, _PS_MODULE_DIR_.$this->name.'/upload/'.$file_name)) {
              return $this->displayError($this->trans('An error occurred while attempting to upload the file.', array(), 'Admin.Notifications.Error'));
            }
            return array('success' => true, 'filepath' => $this->base_path().'/modules/'.$this->name.'/upload/'.$file_name, 'filename' => $file_name);
          }
        }
    }


public function renderForm()
    {
       $this->_html .= '<form id="save_post_image" action="save_post_image">
                                                    <input type="file" name="file" placeholder="Post name">
                                                    <a href="index.php?controller=AdminModules&configure=test_module&token='.Tools::getAdminTokenLite('AdminModules').'" class="edit btn btn-default">
	                                                     '.$this->l('Save').'
                                                    </a>
                                                </form>';
    }


public function getContent()
    {        
        
        $this->_html .= $this->postProcess();
        
        $this->renderForm();

        return $this->_html;
    }

 

JS:

    jQuery('body').on('change', '#file', function(){
        var file = this.files[0],
          formData = new FormData(),
          link = jQuery(this).closest('form').attr('action'),
          element = jQuery(this);
          formData.append('uploadFiles', '1');
          formData.append('file', file);
          doUpload(formData, link, element);
      });

    var doUpload = function($file, $link, $element){
      jQuery.ajax({ 
        type:"POST",
        url:$link,
        data:$file,
        contentType: false,
        processData:false,
        success:function(result){
          var data = jQuery.parseJSON(result);
          if(data.success){
            console.log(data.success);
          }else if(data.error){
            alert(data.error);
          }
        },
        error:function(error){
          
        }
      });
    }

 

Edited May 14, 2020 by Guest (see edit history)