[RAILS] Implementation of image preview function

<%= attachment_image_tag @user, :image, size: "300x300", fallback: "no_profile.jpg ", size: "300x300" , id: "img_prev"%>

<script>
$(function(){                                         
    $('#user_image').on('change', function (e) {        #Get information from id
    var reader = new FileReader();　　　　　　　　　　　　#Get existing image url
    reader.onload = function (e) {
        $(".image").attr('src', e.target.result);
    }　　　　　　　　　　　　　　　　　　　　　　　　　　　　#This is for image acquisition
    reader.readAsDataURL(e.target.files[0]);　　　　　   #Insert the url of the uploaded image into the obtained url
});
});

</script>

Recommended Posts