2

Ok here is my code - stock standard and works if I simply select an existing image

 jQuery(function($){
 var file_frame;

 $('#upload-button').on( 'click', function( e ){
    e.preventDefault();
      // If the media frame already exists, reopen it.
if ( file_frame ) {
  file_frame.open();
  return;
}
 // Create a new media frame
file_frame = wp.media({
  title: 'Select or Upload Media Of Your Chosen Persuasion',
  button: {
    text: 'Use this media'
  },
  multiple: false  // Set to true to allow multiple files to be selected
});

 file_frame.on('open', function(){
     console.log("inside open");

 });
    file_frame.on('update', function(){
     console.log("inside update");
 });
file_frame.on('select', function(){

        // This will return the selected image from the Media Uploader, the result is an object
        var uploaded_image = file_frame.state().get('selection').first();
        // We convert uploaded_image to a JSON object to make accessing it easier
        // Output to the console uploaded_image
        console.log(uploaded_image);
        var image_url = uploaded_image.toJSON().url;
        // Let's assign the url value to the input field
        $('#image-url').val(image_url);
    });
    file_frame.open();
});
});

But if I goto drag and drop an image in there the image is uploaded but an error is returned "An error occurred in the upload. Please try again later."

What have I missed, I'm assuming its some kind of refresh for the existing media selection window and my googling has not turned up anything.

Cheers

EDIT

I have tried several things to get the uploaded image to be shown in the media frame once uploaded. Not having much success. As I said it appears the image is uploaded and added to the media library but I am missing a refresh or reload of the frame to show the image.

Any one have experience with or know another place to go look?

David
  • 31
  • 6

1 Answers1

3

Maybe this call when everything is 'done':

if(wp.media.frame.library) wp.media.frame.library.props.set({ignore: (+ new Date())});

Or if you need to separate the library Grid modal from media upload (edit post) modal:

if(wp.media.frame.library){
    wp.media.frame.library.props.set({ignore: (+ new Date())});
  } else if(wp.media.frame.content.get().collection){
    wp.media.frame.content.get().collection.props.set({ignore: (+ new Date())});
    wp.media.frame.content.get().options.selection.reset();
}