I'm using Dropzone.js to allow a user to upload some .json files to a web app. These json files are then parsed and used on a different page.
I've got this working using the 'addedfile' event and a FileReader() object.
However, I would like to avoid dropzone trying to upload the files and making a failed POST call to '/undefined'.
How could I achieve this?
Thanks!
You need to set autoProcessQueue dropzone option to false. With autoProcessQueue set to false dropzone will not upload files independently. Check Dropzone.js documentation for more details.
Related
I have some files in the local and know the path of those files.
I'm trying to upload the file using AJAX.
How to upload the file using AJAX without using FORM.
enter code here
NOTE: I've the FileReader object of the file.
Please share if u have any idea.
Thanks
You cannot upload a file from the local computer unless triggered by the user (the user should select the file), you can upload a file with jQuery:
https://github.com/blueimp/jQuery-File-Upload
https://github.com/hayageek/jquery-upload-file
I was looking at the upload script here:
http://demo.tutorialzine.com/2013/05/mini-ajax-file-upload-form/
It is using jquery file upload to upload multiple files at once. I would like to know how to pass the order of the files that were selected to the upload.php script. ie. if you have 1.jpg, 2.jpg, 3.jpg, 4.jpg, and 4 finishes uploading first, can upload.php receive a variable that tells it that it is the 4th image that was selected? Does jquery file upload have a way of adding the order to the form action perhaps?
Thanks in advance.
It should automatically upload and read the data in the order it was received once it hits the upload.php layer. So just make sure you upload the files in the order you want them.
Well it was a really easy fix once I found it. There is a variable in the jquery.fileupload.js file called sequentialUploads. Set it to true, and it will force the order of uploads to be the order in which the files are selected.
I have a node.js/express site which has an upload dropbox which use dropzone.js to do drag and drop uploads. My dropzone inside my jade template looks like this currently:
div(id="dropzone")
form(method="POST" action="/upload" class="dropzone" id="my-dropzone")
div(class="dz-message")
span Drop your zipped AgentCubes project here to upload it
This currently works fine, but in the case where the user uploads the same file again I would like to provide the option to overwrite the old file or generate a new name for the duplicate upload. This would not work with my current scheme which simply sends the file /upload which is an express endpoint I have created which currently handles the upload.
It is also complicated by the fact that I would need to post to the server to decide if the file is a duplciate upload, then show the bootbox.js dialog in the client and then finally send the upload data to the server. I have looked through the dropzone.js documentation but I can't seem to find anyway to accomplish this. How can this be done?
I have a little bit of an unusual situation I guess. I have a page for placing new orders and part of a new order is a variable (0-n) number of files that are to be uploaded and associated with the order on the back end. The user also needs to specify a description for each file.
I've used a couple jQuery upload plug-ins with great success, but in this case I'm not looking to upload a single file when the user hits "OK." What I really need to do is upload a file by passing a local path to some method that will do the upload.
Does anyone know of any plug-ins that do this?
Thanks!
Ajax Uploader could be helpful? I believe it allows multiple uploads.
I am new on Javascript. However I want to implement the jquery plugin for File uploading.
Here is the setup guide I found but I have no basic knowledge on how to setup this.
I am using python (flask) as my server side implementation
From the setup guide heading,
Using jQuery File Upload (UI version) with a custom server-side upload handler
I have no idea on how to setup point 1, 4, 5
for 1, what is a upload handler? and how to implement in python (flask)?
for 4, what doses "Upload the jQuery-File-Upload folder to your website."??? what is it use for?
and for 5, I have to return a JSON response on the upload handler? Why we have to do that?
The setup is quite complicated...anyone can give me some hints?
Kit
Maybe one or two hints:
The upload handler is simply a URL endpoint that the jQuery File Upload can send files to - it needs to be able to handle incoming HTTP requests.
#app.route("/uploads", methods=["GET", "POST"])
def upload_handler():
# Handle the upload here
pass
You don't need to upload the entire folder - only the CSS and JavaScript you will be using. If you only need file uploading your template could look like the basic setup. (However, you should minify and concatenate your files for a deployed website).
You return a JSON response to the upload handler so that the script handler performing the XHR file upload request can know things like:
What the URL for the uploaded image is (and the thumbnail, if you are making thumbnails).
What the delete URL (and method) is.
The linked example for Flask seems very similar to the Django example for the new version - you can probably start with that and then patch it to work with the new version of jQuery file upload.