• 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

    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
    I will keep both the sites up to date with the newest information.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Moderator bcworkz

    (@bcworkz)

    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

    (@stefanjanssen)

    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

    (@bcworkz)

    Oops, you’re right, onfocus is invalid for frames. Try onpageshow. Other valid events are onload, onresize, onscroll.

    Thread Starter stefanjanssen

    (@stefanjanssen)

    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

    (@bcworkz)

    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.