I have been trying to upload multiple images in Laravel 4, using jQuery & Ajax without the page refreshing, with the progress bar, remove button and review (display the uploaded thumbnail where remove deletes it from the DB).
I have taken many approaches, (http://packalyst.com/packages/package/sukohi/surpass) (despite following every step, still doesn't work). Another approach I used (https://gist.github.com/filip-adriginal/bd397c5ec22a5916a966#file-gistfile1-txt) and tried the jQuery-File-Upload.
I am able to upload multiple images using (using foreach in the Controller):
{{ Form::file('image[]', array('multiple'=>true)) }}
I have also looked at videos, tutorials and blogs, but they either had partial information or unsolved problems.
If anyone could give me some sample code, or point me in the right direction, that would be great! Thanks everyone for any help, really appreciate it.
try DropzoneJs. I think it is the best upload JS plugin
Howto : AJAX multiple file upload in Laravel is a great tutorial using Dropzone.js, check it. Also take a look at this tutorial Laravel Ajax Multiple Image Upload and Preview which uses Dropzone.js as well.
Related
I have a galery of users that show all of user photos. I want to have small thumbnails for each photos.
How to make it?
Also I notice some website even create thumbnail that focus on the face part of the original photos.
I don't have any code just looking for suggestions.
Im using PHP, Codeigniter, Angularjs, Jquery.
Thank you!
In your controller when receiving the file, before uploading it, you need to do some processing to it. each image you will save it in 4 or 3 sizes, it will be like this for image called imageHello.jpg:`
site.com/images/large/imageHello.jpg
site.com/images/small/imageHello.jpg
site.com/images/thump/imageHello.jpg
So basically it will be site.com/images/[size]/imageHello.jpg, in the front end side you will file the size with what you want based on the page.
for zooming you can use this library, look at this example
I am working on a simple profile update form and I need to have a progress bar for the photo upload. I am new to this and have no clue where to begin.
I am trying to upload the file as an input field in the form with the type as file. With larger files, I cannot track if the upload has failed or frozen and would like a progress bar.
I can create a bar which is filling according to percentage but I still need to have the information from the server which I don't understand how.
I read somewhere that PHP 5.4 and above provides this information via the $_SESSION in the form of session.upload_progress.name but I also read somewhere else that Laravel does not use the conventional session and this won't work.
Is there a way to get this to work. I don't have a multiple image upload so I don't wish to install those third party libraries out there. I just want to keep it simple and somehow fetch the upload information from the server.
What is the simplest way to go around this problem?
The simplest way is to do it via jQuery and AJAX - using something like http://www.dropzonejs.com/ - which is awesome and very easy to use
I have constructed a site for users to upload their own work and share it.
At the moment, people can search the database for pieces of work and they can upload their own which is working fine.
However, when someone uploads a piece of work I have to manually duplicate a php page, add the url into the database and edit the query to show the relevant content.
I was wondering if there was any way of getting my php file to do this for each upload.
Thanks, Tyler
i have a doubt with the upload system in PHP.
What is the difference between Normal Upload [ without ajax ] and Ajax Upload ?
By using Javascript i can send values to the server ,is it possible in the case of Files ?
Is there any limitation for this ? and i found that so many uploaders are using FLASH for to upload FILES,
ex:Gmail,uploadify.....
How can i build a basic uploader with JQUERY/javascript ? also i heard that i cant send FILE by a XHR request.
i am using Codeigniter Framework.
Expecting Possible duplicate or other refference
Main Goal Of this Question is to build my own uploader for my current project[neat and clean]
Okay, AJAX upload is basically just that, it's going through Javascript. The difference is that the page does not upload, and you can carry on with other things as it works. It generally makes for a better user experience in my opinion, it feels more seamless
On the other hand, it only works for newer browsers. Firefox, Chrome, Opera have it, but not IE (maybe Safari?). It also works well with drag and drop. I once made an image uploader inside a text editor, where it popped up a table with your currently uploaded images, you clicked one and it added it to the textbox or you dragged a new image into a box and it uploaded and displayed it straight away. It was beautiful.
Here's the plugin I used to help me
http://dropup.net/
Edit: No limitations either, you can even send plain binary data in
well as if you want to upload the file with jquery ajax request then use ajax form plugin as well,
this link Ajax From will help you to understand and implement on your page,
but i don't know about codignighter frame work cause i don't have experience of that. And ajax is the best way to distribute the process into different parts with any extra load on the page i mean ajax request will work on the back end..
Strange trouble
I want to upload image via ajax which many plugin does but none support textarea to write caption. As i want to assign a caption to every image ,how do my new learning task makes it different is i want user to be able to put up caption whilst image is uploading.
Do any one know of such plugin that just donot send ajax request but also have text box requests attached
Well, to answer your question, I don't know of any such plugin.
However, all plugins should support custom parameters to send as GET or POST. Check the documentation.
If it doesn't, then it sucks. You can however mod it yourselt.
If it does, then it is a simple issue of fetching the textarea value and attaching it in one such parameter to be sent.
Hope this helps you.