Media manager multiple selection

Question

I was creating a plugin, and its part should by adding files to custom posts. I managed script to work, but after few changes, to better look and function, it allows only one file to be added, than no other is allowed. Can you help me, please?

jQuery(document).ready(function($){
var custom_uploader;
$('#songbook_addfile_button').click(function(e) {
e.preventDefault();
//If the uploader object has already been created, reopen the dialog
if (custom_uploader) {
    custom_uploader.open();
    return;
}
//Extend the wp.media object
custom_uploader = wp.media.frames.file_frame = wp.media({
    title:"blemblem",
    button: {
        text:"blemblem"
    },
    multiple: true
});
custom_uploader.on('select', function() {
        var selection = custom_uploader.state().get('selection');
        selection.map( function( attachment ) {
        attachment = attachment.toJSON();
        extension = extension(attachment.url).replace('.','');
        alert(extension);
    //...one commented line, that was to add files into HTML structure - works     perfect, but only once
        });
    });
    custom_uploader.open();
    });
    });

and the one fc to get extension from URL is this:

function extension(url) {
var ext=(url = url.substr(1 + url.lastIndexOf("/")).split('?')    [0]).substr(url.lastIndexOf("."));
return ext;
};

When click the open media manager button, it opens

when select one and click add media, its added(or in this code alerted)

when more files are selected, it takes only the first

after adding first file, then it opens on click, but don't add any file when click the manager add button.

Please, can you show me the right way to go? Thank you

Answer 1

I've edited your code a little and the alert() runs for each selected item. Note that in your code you execute a return too early that make the code bellow don't run after the first run. Also, you use the same name for a function and for a string var, which is not very appropiate.

function get_the_extension(url) {
    var ext=(url = url.substr(1 + url.lastIndexOf("/")).split('?')[0]).substr(url.lastIndexOf("."));
    return ext;
}

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

    var custom_uploader;
    $('#songbook_addfile_button').click(function(e) {
        e.preventDefault();
        //If the uploader object has already been created, reopen the dialog
        if (custom_uploader) {
            custom_uploader.open();
        }
        //Extend the wp.media object
        custom_uploader = wp.media.frames.file_frame = wp.media({
            title:"blemblem",
            button: {
                text:"blemblem"
            },
            multiple: true
        });
        custom_uploader.on('select', function() {
            var selection = custom_uploader.state().get('selection');
            selection.map( function( attachment ) {
                attachment = attachment.toJSON();
                var the_extension = get_the_extension(attachment.url).replace('.','');
                    alert(the_extension);
                    //...one commented line, that was to add files into HTML structure - works     perfect, but only once
            });
        });
        custom_uploader.open();
    });
});