How to set multi ratio size on multi instance of fileuploader on a page

[mrhieuit]

I have a page with multi instance of fileuploader on the page. How I set ratio size for each instance of fileuploader on this page.

For example:

• Fileuploader 1: upload avatar image with default ratio size is: 1 x 1.
• Fileuploader 2: upload cover image with default ratio size is: 16 x 9.

And allow the user to crop the image again by dragging the crop area. Keep the default aspect ratio size set for each item of Fileuploader on the page.

Please help me. Best regards!

[mrhieuit]

Hi @innostudio, are there any solutions to this problem? I'm using Asp.Net Webform. Please help me. Best regards!

[innostudio]

@mrhieuit here is a way how you can do that:

1. using .each() jQuery method

   <input type="file" name="files" data-ratio="1">

   $('input:file').each(function(index, el) {
   var $el = $(el),
       ratio = $el.attr('data-ratio');
   
   $el.fileuploader({
       editor: {
           cropper: {
               ratio: ratio
           }
       }
   });
   });

[mrhieuit]

I got it. Thank you so much