0

I'm studying theme development and am working on some code for a media uploader that can be used to add a picture. The file frame is opening (and I've called wp_enqueue_media(); for that to be the case), but nothing happens after the picture is selected.

I think I'm missing something simple and, frankly, I'm going crazy looking for it. Could anyone help me out?

jQuery(document).ready(function($){

  var mediaUploader;

  $('#upload-button').on('click', function(e){
    e.preventDefault();
    if(mediaUploader){
      mediaUploader.open();
      return;
    }

    mediaUploader = wp.media.frames.file_frame = wp.media({
      title: 'Choose a profile picture',
      button: {
        text: 'Choose Picture'
      },
      multiple: false
    });

    //This alert fires.
    alert("First message.");

    $(mediaUploader).on('select', function(){
      //This alert does not fire.
      alert("Second message.");
    });

    mediaUploader.open();
  });

});

1 Answer 1

1

Embarrassing.

$(mediaUploader).on('select', function(){

Should be:

mediaUploader.on('select', function(){

In case anybody stumbles upon this, $({item}) looks for the item in the DOM, not the variable of the same name in the previous code. Since the select event isn't firing in the DOM, the callback function isn't going to fire either.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.