0

I have created a custom plugin and there has an image upload option.

In view page:
<div class="form-group"> <label class="control-label col-sm-2">Trade Photo:</label> <div class="col-sm-10"> <input type="button" class="btn btn-info" id="t_photo" value="Upload Photo" required> <span id="show-image"></span> <input type="hidden" id="trade_pic" name="trade_pic"> </div> </div>

And is js area:

   var image = wp.media.frames.file_frame = wp.media({
        title: 'Upload Image for Trade Details',
        button: {
          text: 'Choose Image'
        },
        multiple: true
      });
      image.on('select', function() {
        var selection = image.state().get('selection');
        selection.map( function( getImage ) {
            getImage = getImage.toJSON();
            jQuery("#show-image").after("<img src=" +getImage.url+" style='height:50px;width:50px;'/>");
            jQuery("#trade_pic").val(getImage.url);
        });
      });
      image.open();

How to upload multiple images using this method? I got all images but in value, it returns only the first image? How to get all images URL with separated (,)

0

I solved it here is my code:

      image.on('select', function() {
        let selection = image.state().get('selection');

        let _getImage = [];

        selection.map( function( getImage ) {
            _getImage.push(getImage.toJSON())

            getImage = getImage.toJSON();

            jQuery("#show-image").after("<img src=" +getImage.url+" style='height:50px;width:50px;'/>");

        })

        jQuery("#trade_pic").after("<input type='hidden' name='trade_pic' value='"+_getImage.map(val=> val.url)+"'/>")

      });

      image.open();

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.