Title: Media Library in plain javascript
Last modified: August 31, 2016

---

# Media Library in plain javascript

 *  [stefanjanssen](https://wordpress.org/support/users/stefanjanssen/)
 * (@stefanjanssen)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/media-library-in-plain-javascript-1/)
 * I’m working with wordpress and I’m creating a theme for myself. I want to use
   the wordpress media library in the admin panel. So after some searching I found
   this page: [https://codex.wordpress.org/Javascript_Reference/wp.media](https://codex.wordpress.org/Javascript_Reference/wp.media)
 * There are multiple tutorials to add this media library with jQuery, but I would
   like to do it in a plain javascript way. I’ve no trouble converting the jQuery
   to javascript except this piece of code:
 *     ```
       // When an image is selected in the media frame...
           frame.on( 'select', function() {
               // Removed unrelevant code
         });
       ```
   
 * Ive tried the following things:
 *     ```
       frame.select = function(){};
       frame.onselect = function(){};
       frame.addEventListener('select',function(){});
       ```
   
 * None of them are working, I get an error on the last one:
 * > frame.addEventListener is not a function
 * So I hope I can get some help from here. I love everyone trying to help, but 
   I don’t want to hear: “use jQuery”. The choice for not using jQuery is one I 
   made on purpose.
 * StefanJanssen
 * I also placed this question on StackOverflow a few days back:
    [http://stackoverflow.com/questions/37240944/wordpress-media-library-in-plain-javascript](http://stackoverflow.com/questions/37240944/wordpress-media-library-in-plain-javascript)
   I will keep both the sites up to date with the newest information.

Viewing 5 replies - 1 through 5 (of 5 total)

 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/media-library-in-plain-javascript-1/#post-7402641)
 * There is no native frame object in JS, you need to refer to it as a DOM element,
   possibly determined by `document.getElementById()` or similar. There is also 
   no `onselect` event for frame elements, you probably need to use `onfocus`.
 *  Thread Starter [stefanjanssen](https://wordpress.org/support/users/stefanjanssen/)
 * (@stefanjanssen)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/media-library-in-plain-javascript-1/#post-7402845)
 * _onfocus_ isn’t working unfortunately. Since I really need it this functionality
   for this project I will use jQuery if I don’t have a working solution before 
   the end of this week :'(.
 * Thanks for the suggestion.
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/media-library-in-plain-javascript-1/#post-7402850)
 * Oops, you’re right, `onfocus` is invalid for frames. Try `onpageshow`. Other 
   valid events are `onload, onresize, onscroll`.
 *  Thread Starter [stefanjanssen](https://wordpress.org/support/users/stefanjanssen/)
 * (@stefanjanssen)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/media-library-in-plain-javascript-1/#post-7402854)
 * I just saw some other code which made me think jQuery is already in wordpress?
   The reason I didn’t want to use it is because it’s a really heavy package. But
   if its already included I think there is nothing to stop me from using it…
 * I will check the events you mentioned out to see if it works (its still better
   to use plain javascript if possible)
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/media-library-in-plain-javascript-1/#post-7402860)
 * Yes, WP has jQuery within its distribution. Loading an external jQuery library
   from googleapis.com (or any other external source) is frowned upon because of
   this. But depending on what page you’re dealing with, it may not be loaded for
   your use. If something else on the page is using and loading jQuery, you may 
   as well use it too. Check the page’s HTML source for a script block with wp-admin/
   load-scripts.php as src that includes ‘jquery-core’ as an URL parameter.
 * If jQuery would only be loaded because of your script, then there is something
   to be gained by avoiding it if you can.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Media Library in plain javascript’ is closed to new replies.

## Tags

 * [media library](https://wordpress.org/support/topic-tag/media-library/)

 * In: [Hacks](https://wordpress.org/support/forum/plugins-and-hacks/hacks/)
 * 5 replies
 * 2 participants
 * Last reply from: [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * Last activity: [9 years, 11 months ago](https://wordpress.org/support/topic/media-library-in-plain-javascript-1/#post-7402860)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics