JSFiddle - React, Tailwind, and code Playground

by Shirly Manor

HTML

<button id="upload_widget" class="cloudinary-button">Upload files</button>
<ul id="preview">
</ul>
<script src="https://widget.cloudinary.com/v2.0/global/all.js" type="text/javascript"></script>

<script type="text/javascript">
var file_name="";
    var myWidget = cloudinary.createUploadWidget({
    		preBatch: (cb, data) => {
     file_name=data.files[0].name;
     console.log(file_name);
      cb(); 
    },
        cloudName: 'dfkm8017f',
        upload_preset: 'djn1k3cf',
        }, (error, result) => { if (result.event == "success") {
            console.log(result.info) // result.info contains data from upload
        } })

        document.getElementById("upload_widget").addEventListener("click", function(){
            myWidget.open();
        }, function(error, result) {
      console.log(error, result);
      });

</script>