Get Contact form 7 multiple image name

Question

I have created a multiple image selection button with this plugin.

https://wordpress.org/plugins/multifile-upload-field-for-contact-form-7/

below is my contact form 7 code.

<div class="file wrap">
    <div class="fileText">Upload Photos</div>
    [multifile multi-images id:img_upload]
</div>
<div class="file_names">No file selected</div>

Now i want that if user will select multiple images then all image names will come like this xyz.jpg, abc.png, pqr.jpg at the place of "No file selected"

Answer 1

You can do this with jQuery. Add this code in your js file.

jQuery('.file input[type="file"]').on('change', function () {
    var names = [];
    for (var i = 0; i < jQuery(this).get(0).files.length; ++i) {
        names.push(jQuery(this).get(0).files[i].name);
    }
    jQuery(this).parent().parent().parent().parent().find('.file_names').text(names.join(", "));
});