daijinara
Joined 11/27/2020
daijinara said almost 4 years ago on StimulusJS, Active Storage and DropzoneJS :
thank you for your kindness David. I am not sure if this is the correct answer but, the log just shows this:

"undefined" on console.log(blob)

daijinara said almost 4 years ago on StimulusJS, Active Storage and DropzoneJS :
[Log] undefined (admin-116a425f6e4133270456.js, line 289)

daijinara said almost 4 years ago on StimulusJS, Active Storage and DropzoneJS :
Hi David! YES, I solved it!!

The issue was on DigitalOcean that it does not accept localhost:3000,
Response to preflight request doesn't pass access control check

This is how I solved.

1. create cors.xml
2. parse cors.xml to DigitalOcean Sapces through s3cmd by "s3cmd setcors cors.xml s3://{bucket_name}"

s3cmd installation:
https://www.digitalocean.com/docs/spaces/resources/s3cmd/

Your dropzone_controller.js code is the most simple and comprehensive, and it's a great starter compare to others in my opinion!

Thank you so much for your help David!  




daijinara said almost 4 years ago on StimulusJS, Active Storage and DropzoneJS :
Thank you for your kindly providing the direction too! 

Can I also request you for the StimulusJS and Datatable.net tutorial? 

daijinara said almost 4 years ago on StimulusJS, Active Storage and DropzoneJS :
Thank you for your consideration :)

I figured out my datatable_controller.js as below. I hope it is useful to the community members here :D

import DataTable from "datatables.net";
require('datatables.net-bs4');
require('datatables.net-buttons');
require('datatables.net-buttons-bs4');
require('datatables.net-select');

export default class extends ApplicationController {
	static targets = ["table"]

	initialize() {

		const options = {
			keys: !0,
			select: {
				style: "multi"
			},
			language: {
				paginate: {
					previous: "<i class='fas fa-angle-left'>",
					next: "<i class='fas fa-angle-right'>"
				}
			},
		};

		// Init the datatable
		const table = $('#datatable-basic').on( 'init.dt', function () {
			$('div.dataTables_length select').removeClass('custom-select custom-select-sm');
	  }).DataTable(options);
  }

}