Magento 2, novo widget com parâmetro de seleção de imagem, não salva imagem

18

Eu crio um novo widget e um dos parâmetros é um seletor de imagens, apenas uso esse código. Tudo parece bem. Posso abrir a pasta de mídia e escolher a imagem que quero usar. Quando escolho a imagem, o campo de imagem no formulário é preenchido com este valor:

http://local.magento.com/admin/cms/wysiwyg/directive/___directive/e3ttZWRpYSB1cmw9Ind5c2l3eWcvcHVycGxlLmpwZyJ9fQ,,/key/4c150d984998702b74709a2d4aaa

Mas quando eu salvo os dados do widget de formulário, o campo de imagem tem esse valor: {{media url=

nada mais. Como posso resolver isso?

mvistas
fonte
2
O problema estava na configuração. Em Configuração> Geral> Gerenciamento de Conteúdo, "Use estática URLs para conteúdo de mídia em WYSIWYG para Catalog" Ele deve ser "sim"
mvistas
11
o problema com este approache é que você vai ter problemas se deslocam de um env para outro como a imagem codificado não vai funcionar
open-ecommerce.org

Respostas:

1

Se você deseja enviar uma imagem, por que não usa o botão de seleção de imagem?
Se você gosta do editor, use-o. Mas não é uma maneira adequada de fazer upload de uma imagem usando um editor. Você pode usar o botão. Se você não sabe como fazê-lo. Deixe-me explicar.

Aqui está o meu código. O código abaixo está escrito em um arquivo de bloco que cria um botão.

$fieldset->addField(
        'image',
        'file',
        [
            'name' => 'image',
            'label' => __('Image'),
            'title' => __('Image'),
        ]
    );

Imagem é o nome do campo do banco de dados. No seu caso, é o editor wysiwyg. Não sei o exato, mas verifique o banco de dados uma vez.

O código abaixo é usado para salvar a imagem na sua tabela. Agora coloque esse código no seu controlador.

<?php
namespace Vendor\Module\Controller\Adminhtml\Slider;

use Magento\Framework\App\Filesystem\DirectoryList;

class Save extends \Magento\Backend\App\Action

{

protected $_mediaDirectory;
protected $_fileUploaderFactory;

public function __construct(
    \Magento\Backend\App\Action\Context $context,        
    \Magento\Framework\Filesystem $filesystem,
    \Magento\MediaStorage\Model\File\UploaderFactory $fileUploaderFactory
) 
{
    $this->_mediaDirectory = $filesystem->getDirectoryWrite(\Magento\Framework\App\Filesystem\DirectoryList::MEDIA);
    $this->_fileUploaderFactory = $fileUploaderFactory;
    parent::__construct($context);
}

public function execute()
{
    /*For Image Upload*/

    /** @var \Magento\Framework\Controller\Result\Redirect $resultRedirect */
    $resultRedirect = $this->resultRedirectFactory->create();

    try{
        $target = $this->_mediaDirectory->getAbsolutePath('imagefolder/');

        $targetOne = "imagefolder/";
        /** @var $uploader \Magento\MediaStorage\Model\File\Uploader */
        $uploader = $this->_fileUploaderFactory->create(['fileId' => 'image']);
        /** Allowed extension types */
        $uploader->setAllowedExtensions(['jpg', 'jpeg', 'gif', 'png', 'zip', 'doc']);
        /** rename file name if already exists */
        $uploader->setAllowRenameFiles(true);
        /** upload file in folder "mycustomfolder" */
        $result = $uploader->save($target);
        /*If file found then display message*/
        if ($result['file']) 
        {
            $this->messageManager->addSuccess(__('File has been successfully uploaded')); 
        }
    }
    catch (Exception $e) 
    {
        $this->messageManager->addError($e->getMessage());
    }
    /*For Image Upload Finished*/ 

    $data = $this->getRequest()->getPostValue();

    $data['image'] = $targetOne.$result['file'];

    if (!$data) {
        $this->_redirect('*/*/filenaem');
        return;
    }
    try {

        $rowData = $this->_objectManager->create('Vendor\Module\Model\Slider');

        $rowData->setData($data);

        if (isset($data['id'])) 
        {
            $rowData->setEntityId($data['id']);
        }
        $rowData->save();
        $this->messageManager->addSuccess(__('Row data has been successfully saved.'));
    } 
    catch (Exception $e) 
    {
        $this->messageManager->addError(__($e->getMessage()));
    }
    $this->_redirect('*/*/index');

    return $this->resultRedirectFactory->create()->setPath(
        '*/*/upload', ['_secure'=>$this->getRequest()->isSecure()]
    );
}

/**
 * Check Category Map permission.
 *
 * @return bool
 */
protected function _isAllowed()
{
    return $this->_authorization->isAllowed('Vendor_Module::Module_list');
}

}

Depois disso, você deseja chamá-lo em phtml para o resultado ... então, abaixo, escreva o código no arquivo phtml.
Aqui está o código.

    $collection = $block->getCollectionFor();
    $_objectManager = \Magento\Framework\App\ObjectManager::getInstance(); //instance of\Magento\Framework\App\ObjectManager
    $storeManager = $_objectManager->get('Magento\Store\Model\StoreManagerInterface'); 
    $currentStore = $storeManager->getStore();
//Base URL for saving image into database.
    $mediaUrl = $currentStore->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_MEDIA);

getCollectionFor () é gravado em meu block.so, de acordo com isso, você deve aplicar como seu arquivo de bloco.
Espero que isso seja útil para você. Se você tiver alguma dúvida, me avise.

Vishnu Salunke
fonte
Eu chamei um resultado no arquivo phtml usando o gerenciador de objetos. Não será uma maneira adequada, mas eu não quero escrever mais um código aqui. É por isso que eu o uso.
Vishnu Salunke
0

Verifiquei o código e descobri que o código para obter o URL da imagem do diretório não está incluído. Você precisa trabalhar para resolver esse problema. O código para incluir o URL da imagem está ausente.

Marc Feber
fonte
0

Parece que este é um problema conhecido no Magento 2.1. Aqui está um link para o github para obter mais informações sobre o tópico. https://github.com/magento/magento2/issues/6138 Parece que pode haver algumas correções diferentes para tentar.

Cary Wolff
fonte
0

Usando jquery, podemos salvar a imagem em uma pasta.

No script, escreva este código

<script>
    function file_up(id)
    {
        var up_id = 'uploadfiles'+id;
        var upremv_id = 'upload'+id;
        var files = document.getElementById(up_id).files;
        for (var i = 0; i < files.length; i++)
        {
            uploadFile(files[i],up_id,upremv_id);
        }
    }
    function uploadFile(file,up_id,upremv_id){
        var url = "<?php echo $baseurl ?>helloworld/index/upload";
        var xhr = new XMLHttpRequest();
        var fd = new FormData();
        xhr.open("POST", url, true);
        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4 && xhr.status == 200) {
                jQuery('#imgna'+up_id).val(xhr.responseText);
                console.log(xhr.responseText); // handle response.
                jQuery('#'+up_id).remove();
                jQuery('#'+upremv_id).remove();
                var img_va = '<img class="image" src="<?php echo $mediaUrl.'custom/'?>'+xhr.responseText+'">';
                jQuery('#pre'+up_id).html(img_va);
            }
        };
        fd.append('uploaded_file', file);

</script>

Em seguida, no seu controlador personalizado:

O Upload de classe estende \ Magento \ Framework \ App \ Action \ Action {

public function __construct(\Magento\Framework\App\Action\Context $context)
{
    parent::__construct($context);
}

public function execute()
{
    $objectManager = \Magento\Framework\App\ObjectManager::getInstance();

    $fileSystem = $objectManager->create('\Magento\Framework\Filesystem');
    $mediaPath = $fileSystem->getDirectoryRead(\Magento\Framework\App\Filesystem\DirectoryList::MEDIA)->getAbsolutePath();
    $media = $mediaPath . 'custom/';

    //  exit;


    $file_name = rand() . $_FILES['uploaded_file']['name'];
    $file_size = $_FILES['uploaded_file']['size'];
    $file_tmp = $_FILES['uploaded_file']['tmp_name'];
    $file_type = $_FILES['uploaded_file']['type'];

    if (move_uploaded_file($file_tmp, $media . $file_name)) {
        echo $file_name;
    } else {
        echo "File was not uploaded";
    }
}

}

consulte Como salvar um upload de imagem em uma pasta no magento2?

E usando o observador, você pode obter o valor da imagem na postagem .. Na tag do campo de entrada, use data-form-part = "product_form".

Rita Jose
fonte