Anonymous194's avatar

Laravel 5 Uploading and display image

Basically I want to upload an image and display it to an user, at the moment when image is selected, nothing happens I get no error mistakes or anything else and I am wondering what is going on. So basically I want to upload an image and display it inside img by replacing src="#" with link to a file which has been saved to public folder.

Here is my code:

    <form action="{{ action('BuilderController@testing') }}" role="form" method="POST">
        <input class="form-control filestyle margin images" data-input="false" type="file" data-buttonText="Upload Logo" data-size="sm" data-badge="false" />
    </form>

    <div class="logo">
        <img class="images" id="image" src="#" alt="Your Logo"/>
    </div>

Controller:

    public function testing() {
        if(Input::file())
        {
            $image = Input::file('photo');
            $filename = time() . '.' . $image->getClientOriginalExtension();
            $path = public_path('images/' . $filename);
            Image::make($image->getRealPath())->resize(200, 200)->save($path);
            $user->image = $filename;
            $user->save();
        }
    }
0 likes
7 replies
nagavinod424's avatar

First u need to write a function in jquery

$('.filestyle').on('change',function(e){

var file = e.target.files[0],reader = new FileReader();

reader.onload =function(c){

    $('#image').attr('src',c.target.result);    
}
    
});
nagavinod424's avatar

one more thing to upload images or file u need to specify

enctype="multipart/formdata" on the form

Anonymous194's avatar

@nagavinod424 This is a code to display the image that is being saved right? But the problem is that file is not being saved at all despite adding enctype to form but I don't know why as there is no errors being displayed

nagavinod424's avatar

Which Version of laravel You are Using?

one More thing the Above jquery that i have sent u is invoked when the input.filestyle is changed

i don't want to tell this but you need to use id for this type of event listners

but the input in your code shown does not have an id so i have given the code to the class of the input

Please or to participate in this conversation.