Return to Answer

Edited the content for better view

Source Link

edit approved May 30, 2017 at 4:49

3.8k
5
33
69

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 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 = ''+xhr.responseText+'">';jQuery('#pre'+up_id).html(img_va);}};fd.append('uploaded_file', file);

<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>

<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>

Source Link

created May 30, 2017 at 4:34

Rita Jose

1.9k
8
28
46

By using jquery, we can save the image to a folder.

In script, write this code

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 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 = ''+xhr.responseText+'">'; jQuery('#pre'+up_id).html(img_va); } }; fd.append('uploaded_file', file);

Then, in your custom controller,

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"; } } }