Re: Re[2]: new form control

On Mon, 23 Apr 2007 15:29:01 +0100, Dmitry Turin <html60@narod.ru> wrote:

>> I'd like ability to automatically (and asynchronously)
>> upload images dragged and dropped onto
>> WYSIWYG editor (or any designated element).
>> <input type=file id=uploader>
>> ...
>> <div dropped-files=uploader>drop here!</div>
>
> Hm. Automatically (and asynchronously) ...
> Imagine, that you drag-and-drop several time:
> form sends so much times (instead of one time, if form is sent manually).

Not necessarily. A single form can contain more than one file. One could  
explicitly allow that via min/max attributes.

Even if user drags and drops files one-by-one, I don't think it's a big  
issue - servers can handle concurrent connections easily, and browser  
might queue/batch file uploads if user drops too many files.

> What's about visual elements,
> we need open explorer for file system in any case.

Drag'n'drop allows you to use your system's file explorer, drag files from  
desktop or other applications - the point is that invoking a new, specific  
file browser is not necessary.

If a typical file browser is desired, one can still use <input type=file>  
(which in my proposal has to be present in the document).

>> When file is dropped onto document, browser would:
>> 1. find first ancestor with dropped-files attribute,
>> 2. set value of <input> designated by this attribute,
>
> Please, explain stated two points.

I imagine mechanism similar to events bubbling up the DOM tree. I'm not  
suggesting using actual DOM events and handlers here for sake of security  
(file uploads are a delicate matter and it would be good to keep untrusted  
code out of it whenever possible) and simplicity (it's as simple as  
specifying ID of file input control in an existing form).

The HTML code:
  <div dropped-files=foo>
would be roughly equivalent to (pseudocode):
  <div dropped-files=foo ondroppedfiles="var input =  
document.getElementById(this.getAttribute('dropped-files')); input.value =  
event.droppedFilePath; input.form.submit()">

I'll try to write more complete example later.

-- 
regards, Kornel Lesinski

Received on Monday, 23 April 2007 22:59:51 UTC