file upload dialog with multiselect - html

I'm working on a file upload solution that adds flexibility to existing options. A standard works fine, but does not allow selecting multiple files. There are plenty of solutions to work around this, I'm aware of that, but I'm looking at the solution Facebook has implemented. the "multiple=true" moniker isn't supported by IE9 and below; Facebook trick this by providing a file dialog (on IE) that allows multiselect and feed the result back to a flash upload handler. My question is: how do I open that file dialog (allowing multiselect)? Once I get that done, I can handle the results from there (sending multiple files to my upload handler isn't a problem, nor is distinguishing between IE9 and other browsers/platforms).

Related

How to change how IE / Chrome opens a file in-browser?

So here's the story. At my company, you can access previous pay statements online via a payroll website. When you go to look at a statement, it will open the statement in-browser via a pdf viewer. When working properly, it will usually ask if you want to blank out all the data or not (which... why would you want to? the point is to look at your statement). Now, this worked fine when checking it out in Adobe Reader; you'd just click "yes, show data" and everything displays fine, it can be printed, etc. But the company decided that instead of getting Acrobat for editing pdf files, that the better (cheaper) option is to get a cheap/free alternative called "Nuance" something or other. Two users installed this program, and now the browsers open pdfs in-browser with Nuance instead of Adobe Reader. This is a problem, because Nuance doesn't show the option of hiding or showing data like Reader did; rather, it just chooses the "no" option, which results in a blank template pdf coming up.
Now, this whole problem could be solved if we could just get the browsers to use Reader to open pdf files in-browser... obviously it's not a problem if you could download the pdf, but the site doesn't seem to allow you to download the pdf files. We've tried just about everything we could think of, short of uninstalling Nuance altogether, to get IE or Chrome to open pdf files with Reader, but even with a full IE reset, it uses Nuance to open pdfs inside the browser. Changing the default program for pdfs has yielded no results, IE still uses Nuance in-browser.
Anyone have any thoughts on how to change IE or Chrome to default to using Reader to show pdf files instead of Nuance?
Thanks!
just change the default programs or applications that opens pdf files, make it the adobe reader. You'll have to configure it in Windows, the Default Programs in Control Panel. You'll have to do this in each computer.

Get downloadhistory from Selenium

Is there any way I can find out what the latest file Selenium downloaded was, and from where (what URL) it was downloaded?
I am fetching files from a large number of sites (that I do not control) by clicking on elements, and my problem is that I do not know how the files are downloaded. Sometimes it is just an <a> element, sometimes there is a Javascript event attached to some element, or form (not always obvious from inspection), and so on, and so on.
So I though the easiest would be to just do my clicks, and then check what landed in the download folder. But then I have no idea where that file came from, and I also need to store the url.
For files that can be displayed inline, I can, of course, open them in the browser and get the driver.current_url. This is very convenient for file formats where it actually works, so if there is a way to force e.g. Firefox or Chrome to open all files inline, that would also be an option. (I am aware of one such extension. That extension, however, requires some user interaction in a OS file dialogue window, and that seems like overkill here)
Possible solutions
Firefox: Read moz_downloads from downloads.sqlite, in the FF SQLite DB
Chrome: Read the corresponding SQLite db for Chrome/ium
Write browser extensions that modifies the mimetype of visited pages, so that all files are opened as plain in the browser, and the URLs can be accessed from there.
How I understanding selenium it only insert js to page, that mean that you can interact only with web page but not with browser futures.
But you can do like in this post How to access Google Chrome browser history programmatically on local machine if that files are in download history you can find them there.

Legitimate technique for avoiding file download blocker in IE ("To help protect your security")?

My web app allows export of data in a variety of formats. The export is triggered by selecting an export format from a dropdown (<select>), which causes the form to be POSTed and the file returned and downloaded in the requested export format.
This works fine on all browsers except for IE - on IE the "To help protect your security" blocker appears, and clicking on the "Click here for options" causes the page to reload instead of allowing the actual download.
In short IE users can't download files due to the blocker and the subsequent reload instead of download.
I know we can ask users to change their security zone settings to enable download, but for a variety of reasons this is not practical - there are a lot of users in a lot of different environments and they tend to ignore instructions.
Are the rules for what causes the blocker to come up documented somewhere? What's the legitimate, recommended way of allowing file downloads in IE? That is, for the scenario detailed below, how can I setup the HTML/form to actually let the user download the file?
Show the user a list of file formats
Once the user selects a file, download it to her computer without triggering the download blocker on IE
Have your <select> block simply inject (using JavaScript) click here to download text somewhere else in the DOM tree. Then, the user clicks on a standard link and it reloads the full page, downloading the file directly.
You can even have the click to cause GET requests..

html file upload form

I have a web application with a simple file upload requirement (max 1 mb).
The web application is an externally exposed web site that must be (as much as possible) compatible with all browsers and versions.
We are using C# .net 3.5 ASP .Net (IIS 7) technology.
We are having trouble implementing the file upload control:
<input type="file" ... />
The buttons are not clicking correctly and different input methods (eg clicking on the text box in some browsers will open the input field).
We need to avoid 3rd party file upload tools.
What is the best way to make this compatible with all browsers?
Can we use frameworks (eg we could use JQuery) to do this?
Any help is really appreciated.
Edit:
Here are some more specific behaviour details:
Intended/Expected:
Consistent use of textbox field (for filename):
displays filename of selected file
no events fire launch of browse dialog
Consistent use of browse button:
same css standards as standard HTML button for look and feel
opens browse dialog
dialog cancel - clears textbox field
dialog ok - (re)populates textbox field
We would like to have the look and feel of the textbox and button to use the same css as the rest of our web site.
Current:
textbox click events opens dialog
generic display of textbox and button field
browse button not working with some browsers (not firing browse dialog event, but being displayed)
As much as possible the behaviour (events/actions as above) should be consistent between all browser types.
What is the best way to make this compatible with all browsers?
It's already compatible with all browsers. Just don't try too hard to script it or overhaul the style. You have minimal customisation possibilities with the file upload field, partly for obvious security reasons and partly because the multiple-part rendering of the text+button arrangement in many browsers is simply not amenable to styling primitives that operate on single boxes.
(eg clicking on the text box in some browsers will open the input field).
Luckily people whose browsers do that will already be used to file upload fields doing that; indeed, they will expect the browser to do that, and be confused if you manage to stop it.
(And it's a sensible measure: allowing typing in the filename field is seldom useful, but it has caused security holes in the past.)
Consistent use of browse button:
Nothing about the file upload field even mandates a browse button or file-finder dialogue box. You might have eg. drap and drop instead. The browser decides this; as the site author you don't get a look in.
We would like to have the look and feel of the textbox and button to use the same css as the rest of our web site.
This isn't really possible within the realms of HTML. Hence the “third party uploaders”, typically Flash with HTML fallback.
There is one approach that you can sort-of use to make a file upload look like you want, but it's not very nice. You style a text field and button however you like, listen for changes to the file upload field and copy the value to the text field to display. The text field must be read-only because it won't be possible to allow the user to pick a file from there.
You then put the real file upload control on top of the fake one with CSS positioning, and give it CSS opacity (alpha filter in IE) so it's so faint you can't see it. You then have to hope that the browser decides to put a clickable part of the file upload field over the top of where you have rendered your button. Though you can fiddle and check it to work in many popular browsers, it's really very brittle and almost certainly a complete waste of time.
You will not get a consistent UI. Each browser does it's own implementation. A Safari user will expect the Safari method, same for IE and so on.
You might have some success with CSS control of the box but be aware that modern browsers have a lot of security on this field. You will have limited control of this field compared to fields
If you follow instruction here: http://www.15seconds.com/issue/010504.htm
you should be able to have consistent behaviour. Having just
As for styling - this is a task for you. Make sure your HTML and CSS are compatible (work as expected) in all browsers that you support.

How can I upload more than one file from a single HTML form in IE?

Internet Explorer (from versions 4 to 7, at least) limits the number of files uploaded using a single 'input type="file"' form field to one. What is the best approach to take if I want to upload more than one file in a single HTTP POST request?
You have to include multiple input controls, one per file to be uploaded.
If you don't know how many you want ahead of time, you can use jQuery (or plain javascript) to create them on-the-fly.
There's also the SWFUpload library. It allows to select multiple files in the file selection dialog. However, it requires both flash and javascript to be enabled.
There is also a great resource 'File input (or "upload") in HTML forms' which discusses cross-browser issues with file upload.