file-validation-stack.json

{"index.html":"<html><head><script src=\"https://cdn.syncfusion.com/ej2/dist/ej2.min.js\" type=\"text/javascript\"></script>\n    <link href=\"https://cdn.syncfusion.com/ej2/material.css\" rel=\"stylesheet\">\n\n    <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\">\n\n    <style>\n            body{\n                touch-action:none;\n            }\n        </style></head><body><div class=\"stackblitz-container {{theme}}\"><div class=\"col-lg-12 control-section\">\n    <div class=\"control_wrapper\">\n        <!-- Initialize Uploader -->\n        <input type=\"file\" id=\"validation\" name=\"UploadFiles\">\n    </div>\n</div>\n<style>\n    .control_wrapper {\n        max-width: 500px;\n        margin: auto;\n    }\n    .e-upload {\n        width: 100%;\n        position: relative;\n        margin-top: 15px;\n    }\n</style>\n\n\n\n</div></body></html>","index.js":"{{ripple}}\n    var dropElement = document.getElementsByClassName('control-fluid')[0];\n    // Initialize the control with file validation\n    var uploadObj = new ej.inputs.Uploader({\n        autoUpload: false,\n        minFileSize: 10000,\n        allowedExtensions: '.doc, .docx, .xls, .xlsx',\n        asyncSettings: {\n            saveUrl: 'https://aspnetmvc.syncfusion.com/services/api/uploadbox/Save',\n            removeUrl: 'https://aspnetmvc.syncfusion.com/services/api/uploadbox/Remove'\n        },\n        selected: onFileSelected,\n        removing: onFileRemove,        \n        dropArea: dropElement\n    });\n    uploadObj.appendTo('#validation');\n    \n    function onFileRemove(args) {\n        args.postRawFile = false;\n    }\n    function onFileSelected(args) {\n         // Filter the 5 files only to showcase\n        args.filesData.splice(5);\n        var filesData = uploadObj.getFilesData();\n        var allFiles = filesData.concat(args.filesData);\n        if (allFiles.length > 5) {\n            for (var i = 0; i < allFiles.length; i++) {\n                if (allFiles.length > 5) {\n                    allFiles.shift();\n                }\n            }\n            args.filesData = allFiles;\n            // set the modified custom data\n            args.modifiedFilesData = args.filesData;\n        }\n        args.isModified = true;\n    }    \n"}