How to enable Drag Files Here in jQuery UI Widget?

Question

I am using jQuery UI widget Sample http://www.plupload.com/example_jquery_ui.php

Here is my code

$("#uploader").plupload({
  // General settings
  runtimes : 'gears,flash,silverlight,browserplus,html5',
  url : 'upload.php',
  max_file_size : '10mb',
  chunk_size : '1mb',
  unique_names : true,

  // Resize images on clientside if we can
  resize : {width : 320, height : 240, quality : 90},

  // Specify what files to browse for
  filters : [
    {title : "Image files", extensions : "jpg,gif,png"},
    {title : "Zip files", extensions : "zip"}
  ],

  // Flash settings
  flash_swf_url : '/plupload/js/plupload.flash.swf',

  // Silverlight settings
  silverlight_xap_url : '/plupload/js/plupload.silverlight.xap'
});

But the problem is how can I enable Drag Files Here?

Unlike in Events Sample Drag Files is enable?

http://www.plupload.com/example_events.php

Answer 1

The availability of the drag and drop feature depends on your browser and on the current runtime. Looking at Plupload sources, as far as I know, the feature is only available on HTML5 runtime (your examples differ on the runtime order, so run on different runtimes, some of which do not feature drag and drop)

To enable drag and drop on modern browsers, you should put html5 first in your runtime list :

runtimes : 'html5,gears,flash,silverlight,browserplus',