
<link href="~/plugins/DropZone/css/basic.css" rel="stylesheet" />
<link href="~/plugins/DropZone/css/dropzone.css" rel="stylesheet" />

<script src="~/plugins/DropZone/js/dropzone.js"></script>

<form action=@Url.Action("SaveUploadedFile","Upload") method="post" enctype="multipart/form-data" class="dropzone dz-drag-hover" id="Function1">
                    <div class="fallback">
                        <input name="file" type="file" />
                        <input type="submit" value="Upload" />
                    </div>
                </form>


 Dropzone.options.Function1 = {
        autoProcessQueue: false,
        addRemoveLinks: true,
        dictDefaultMessage: defaultUploadText,
        dictRemoveFileConfirmation: null,
        maxFiles: 2,

        init: function () {
            myDropzone = this;

  }
    };



myDropzone.on('addedfile', function (file) {

                //check if file length is more than 2
                if (this.files.length > 2) {

                    //alert and restrict file upload
                    swal({ title: invalid, text: maxLimit });
                    this.removeFile(file);
                    return false;
                }
});

//Remove file section
            myDropzone.on('removedfile', function (file) {
                $('#DivProceed').hide();
                var fileName = { 'fileName': file.name };
                $.ajax({
                    type: 'POST',
                    data: fileName,
                    url: removelUrl,
                    success: function (data) {

                        //If no files hide remove button
                        if (myDropzone.files.length == 0) {
                            $('#BtnRemoveFiles').hide();
                        }
                    },
                });
            });