[wp-trac] [WordPress Trac] #54205: jqxhr is undefined inside of deferred.done() when using wp.media to add a custom image upload

WordPress Trac noreply at wordpress.org
Wed Oct 13 17:49:03 UTC 2021


#54205: jqxhr is undefined inside of deferred.done() when using wp.media to add a
custom image upload
-------------------------------------+-------------------------------------
 Reporter:  metawebdevelopment       |       Owner:  (none)
     Type:  defect (bug)             |      Status:  new
 Priority:  normal                   |   Milestone:  Awaiting Review
Component:  Media                    |     Version:  5.8.1
 Severity:  major                    |  Resolution:
 Keywords:  needs-patch reporter-    |     Focuses:  javascript,
  feedback needs-testing-info        |  administration
-------------------------------------+-------------------------------------

Comment (by metawebdevelopment):

 Replying to [comment:3 metawebdevelopment]:
 > @mai21 That will be way too much to add in here, but the gist of it to
 quickly get to the error would be:
 >
 > 1) Create a new settings/menu page or submenu page in admin with an
 upload button and 2 hidden inputs. One to store the url and one to store
 the image id.
 > 2) Enqueue wp_enqueue_media() if did_action check fails
 > 3) add an on click action to the button and when clicked run the
 following code or similar code that is referenced in the codex and media
 API docs.
 >
 >
 > {{{
 >         $(document).on('click', '.upload_image_button', function(e){
 >             e.preventDefault();
 >             let button = $(this),
 >             custom_uploader = wp.media({
 >                 title: 'Set Image',
 >                 library : {
 >                     type : 'image'
 >                 },
 >                 button: {
 >                     text: 'Use this image'
 >                 },
 >                 multiple: false
 >             }).on('select', function(){
 >                 let attachment =
 custom_uploader.state().get('selection').first().toJSON();
 >                 let imageObject = {
 >                     id: attachment.id,
 >                     url: attachment.url,
 >                 }
 >                 button.siblings('.image_url').val(imageObject.url);
 >                 button.siblings('.img_id').val(imageObject.id);
 >                 button.next().find('img').attr('src', imageObject.url);
 >                 button.next().find('.remove-image').show();
 >             })
 >             .open();
 >         });
 > }}}
 >
 > You will get a console warning when attempting to click the button or
 set an image.

 Just an update that something similar is also causing bugs with custom
 wysiwyg inputs in various plugins that seems to be related.  They will
 load and only run in text mode.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/54205#comment:4>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform


More information about the wp-trac mailing list