JSFiddle - React, Tailwind, and code Playground

by davehol

JavaScript

< script >
  (function() {

    document.addEventListener("DOMContentLoaded", function(event) {
      let allowedFiles = [".doc", ".docx", ".pdf"];
      let fileInput = document.querySelectorAll('input[type=file]');
      let regex = new RegExp("([a-zA-Z0-9\s_\\.\-:])+(" + allowedFiles.join('|') + ")$");
      let fileSize = 0;
      for (let i = 0; i < fileInput.length; i++) {
        this.addEventListener("change", function() {
          let fileInputtest = document.querySelectorAll('input[type=file]');
          for (let k = 0; k < fileInputtest.length; k++) {
            fileSize = 0;
            if (fileInputtest[k].files.length > 0) {
              fileSize = fileSize + fileInputtest[k].files.item(0).size;
              const fileMb = fileSize / 1024 ** 2;

            }

          }
          alert(fileSize);
          if (!regex.test(fileInputtest[k].value.toLowerCase())) {
            alert("bad file");
          }
        });

      }




    });
  })();

<
/script>