Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

plupload multiple drop_elements

I am using Plupload on a page that will have multiple drop_elements as well as browse buttons. My question is, by default with plupload you can define an element for both the drop_element and browse_button, from what i've read and tried it only accepts 1 element which happens to be an ID of that element.

I am needing to somehow extend this, so that I can define an array of id's or change it to be a class instead of an id.

var uploader = new plupload.Uploader({
        runtimes : 'gears,html5,flash,silverlight,browserplus',
        browse_button : **['ele_id1', 'ele_id2']**,
        drop_element : **['dropzone_id1', 'dropzone_id2']**,
        max_file_size : '200mb',
        url: '//senditfrom.me/fileupload/upload/do_upload',
        flash_swf_url: '//senditfrom.me/fileupload/js/plupload.flash.swf',
        silverlight_xap_url: '//senditfrom.me/fileupload/js/plupload.silverlight.xap',

        resize : {width : 320, height : 240, quality : 90}
    });

Is this possible? has anyone found a way around just being able to have 1 element defined?

like image 899
Sherdog Avatar asked Feb 15 '26 06:02

Sherdog


2 Answers

I know this is an old question but I came across the problem of having 2 browse_buttons and found a way to solve it which I'd like to share here.

HTML:

<form id="uploader">
    <input type="button" class="pickfiles" id="0" value="Select 1"/>
    <input type="button" class="pickfiles" id="1" value="Select 2"/>
</form>

JS:

var uploader = new plupload.Uploader(
    {
        browse_button : '0',
        container : 'uploader',
    });

$('.pickfiles').mouseenter(function()
{
    uploader.settings.browse_button = $(this).attr('id'); //Assign the ID of the pickfiles button to pluploads browse_button
    uploader.refresh();
});

See the below jsfiddle for details.

http://jsfiddle.net/wLMNB/

like image 111
David Healey Avatar answered Feb 17 '26 21:02

David Healey


I'm not sure if the plugin has changed since David Healey posted his answer but I found that his answer works with a small modification.

His section:

$('.pickfiles').mouseenter(function()
{
    uploader.settings.browse_button = $(this).attr('id'); //Assign the ID of the pickfiles button to pluploads browse_button
    uploader.refresh();
});

Should be changed to:

$('.pickfiles').mouseenter(function () {
            uploader.setOption("browse_button", $(this).attr('id')); //Assign the ID of the pickfiles button to pluploads browse_button
        });

And presto it works!

like image 35
Rian Mostert Avatar answered Feb 17 '26 19:02

Rian Mostert



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!