CODEWITHSUNDEEP
javascriptmediawordpress-3.5
David O'Sullivan
David O'Sullivan

Reputation: 2999

How to get selection from Wordpress 3.5 media uploader

I am trying to get the selection from a default instance of the new media uploader...

I am happy with the way it displays by default so I am NOT using:-

file_frame = wp.media.frames.file_frame = wp.media(
{
    title: 'Select File',
    button: {
        text: jQuery( this ).data( 'uploader_button_text' )
    },
    multiple: false
});

Just

wp.media.editor.open();

so this doesn't work obviously

attachment = file_frame.state().get('selection').first().toJSON();

but neither does this

wp.media.editor.state().get('selection').first().toJSON();

or this

wp.media.state().get('selection').first().toJSON();

so what is the code I should use?

Upvotes: 2

Views: 4988

Answers (4)

Jan Koch
Jan Koch

Reputation: 11

I know this is a old thread, but I stumbled upon this from a Google search for getting all attachment ids when uploading multiple files.

I slightly adapt Adal's answer, which works perfectly:

                var selection = wp.media.state().get('selection');

                var attachment_ids = selection.map( function( attachment ) {
                    attachment = attachment.toJSON();
                    return attachment.id;
                }).join();

Just adding this as a reference, as Adal got no feedback on the answer back then (and I don't have enough reputation to leave a comment yet).

Upvotes: 1

user2472914
user2472914

Reputation: 11

An adaptation of an answer from here: https://wordpress.stackexchange.com/questions/87357/wordpress-media-manager-3-5-default-link-to

Extending the render function of wp.media.view.Settings.AttachmentDisplay, which then gives access to this.controller.state().get('selection'):

function($) {
   var _AttachmentDisplay = wp.media.view.Settings.AttachmentDisplay;
   wp.media.view.Settings.AttachmentDisplay = _AttachmentDisplay.extend({
      render: function() {
         _AttachmentDisplay.prototype.render.apply(this, arguments);
         selection = this.controller.state().get('selection').first().toJSON();
     //now, for example:
         filename = selection.filename;
      }
   });
})();

Upvotes: 1

Adal
Adal

Reputation: 620

You could try something like this (for a multi-select)... no guarantee it works though:

var selection = wp.media.editor.state().get('selection');

var attachment_ids = selection.map( function( attachment ) {
  attachment = attachment.toJSON();
  return attachment.id;
}).join();

Upvotes: 3

David O'Sullivan
David O'Sullivan

Reputation: 2999

Ok I have a hacky solution to this until someone out there hopefully can post how to do it properly...

jQuery('.media-modal .type-image').on('click',function(index, element) {
var thisCollection = wp.media.model.Query.all._byCid;
setTimeout(function() { //we need this becuse the details area is not generated until after the click
    var thisEditUrl = jQuery('.details .edit-attachment').attr('href');
    var attachId = thisEditUrl.match(/post=([^&]+)/)[1];
    var attachmentAtts = '';
    jQuery.each(thisCollection, function(index,item) {
        if(this.id == attachId)
            attachmentAtts = this.attributes;
    });
},500);
});

Its not ideal because of the setTimeout since we dont know how long it will take for the .details area to be populated but after a day and a half of trying I just cannot work out any other way.

Hopefully someone out there knows how to do this right ;)

Upvotes: 0

Related Questions