I'm not pretty sure if I can accomplish what I need with pure jquery but maybe you guys can help me out.
I need to give the user the opportunity to browse his local computer to choose a location where some files will be saved( the download and saving functionality is handled via a jsp page) but the process of choosing the destination should be done in jquery.
Is this possible ?
I've found some plugins, but they all seem to be server side only.
Its not possible. Javascript in a browser does not have access to file system api's. The absolute best you can do to interact with the file system is accept a 'drop' event from drag and drop, or use <input type="file" />.
Related
Hi guys I need to know is it possible to know a file(say .txt) is open or used in any applications before uploading it using ajax in js.
There is no way to do this from JavaScript. There is a File API which allows you to access local files under certain circumstances but you can't examine open file handles of other processes.
Objective
I am creating a web application and have been looking for an async file upload solution other than iframe and form support.
Browser Support
I am fully willing to exclude everything but IE9+. IE tends to be the browser I have the most trouble with.
Goal
I have a table and I want to be able to click on a link, show a file dialog and then upload the file immediately after selection. No page refresh.
More specifically I am trying to figure out how Trello does their file uploads. After looking through the javascript, I found that they bind the the file input to an on change listener, but after that I can't see what they are doing. Im under the impression that they use websockets with node.js to transfer data, but after doing a little research, most people say that websockets wouldn't be good for that. Trello blocks all versions of IE except 9 and 10 so I looked into HTML5 File upload think that may be a solution. However, after some research IE9 does not support the HTML5 File API.
Question
So finally I am looking for some way to upload files without the iframe and form solution. Can someone list the possible methods I could use?
Sidenote
I am using Rails for backend and Ember.js for front end.
If the browser does not support the File API and XMLHttpRequest level 2, there is no other way to upload files in an async/"ajaxy" manner other than reverting to the hidden iframe method. You could, of course, use Flash or Java, but neither of those (especially Java) seem like a good solution to me.
Regardless of the browser, you will have to include a file input element on the page if you want to provide a file chooser for the user. The onchange listener you speak of is vital to determining when the user has actually selected a file or files. In browsers that support the File API, you can also allow users to drop files they wish to upload onto your page. This behavior alone does not require a file input element.
IE9 and older do not support the File API.
I'm quite familiar with this territory as I maintain a fairly popular javascript-only upload library: Fine Uploader.
i want to check in Javascript whether the uploading process of my rails controller is complete. how can i do this?
my intention is to get the amount of files that has been transfered (i'm doing some byte-checking in the controller and i decide wheter to upload or to keep the file on the client side).
is that even possible? i would do the upload in js but unless you cannot check the files in js i have to upload them via rails.
please help,
kind regards
There are several ways to do this (here's one w/Nginx and jQuery) some of which include drag-and-drop support, etc.
What you want to google is something like rails jquery file upload with progress bar and choose an implementation among the many that are out there.
Is there really NO WAY AT ALL to limit the file types that are shown in a browse file window? I tried this:
<input type="file" accept="text/xml" name="parameter_file" />
Firefox, IE just ignore it. I found the below excerpt from another question:
Accept attribute was introduced in the
RFC 1867, intending to enable
file-type filtering based on MIME type
for the file-select control. But most,
if not all, browsers make no use of
the this attribute.
How else can I do this? I know you can achieve this with Flash but I don't really want to use Flash.
I will be checking selected file type on the server side but I would like to improve user experience by making it easier to only show XML files.
Thanks all for any help.
AFAIK, there is no way to do this. The next best thing would be to use JS to check the file extension before the form is submitted so the user won't waste time uploading a file that is not accepted, but the server-side file type check routine should also be kept, because the first method would be easily bypassed by turning JS off.
Here's a jQuery solution: How to have jQuery restrict file types on upload?
Hope this helps.
It is not possible (for the programmer) to have any influence on the files dialog opened using <input type=file>
This is a security feature and nothing much can be done about it.
If you are in absolute need of this (and other functionalities like allowing multiple selects) then you have to go for a flash (or a java applet etc) implementation of the file open dialog.
There are implementations available on the net, and IIRC, there is one in YUI.
If this can only be done in some browsers, I'd still like to know how...
Basically, I want to have a drag-and-drop feature where users can drag files to a drop zone and then hit "upload" and have the files uploaded to the server.
I was pondering the possibility of having the option to drag an entire folder to the drop zone and uploading all of the folder contents (preferably skipping any hidden or system folders). I can imagine how this would be done via javascript by simply traversing the folder for files (and sub-folders) and adding those locations to the upload list, but I'm pretty sure that would violate some basic policies (for good reason). But I'm not totally sure, since I know that Firefox 3.6 offers something along these lines.
I am thinking it might be possible if most browser policies make an exception for user-initiated events, but I might be dreaming.
Anybody know for sure?
Browsers (before the file API) did not allow dropping things inside them from outside.
They would get intercepted by the browser and considered as drops to the browser engine..
Perhaps it can/could be done with flash or other embedded technologies.. but not directly through browser and javascript..
http://www.uploadify.com/
This will let you do multiple file upload, but not directory upload. If you use a trusted applet, you can get the functionality you desire. It will require more than pure javascript, though.