Dropzone Replace Удалить запрос подтверждения файла с помощью Modal BS4 - PullRequest
Новая
       7

Dropzone Replace Удалить запрос подтверждения файла с помощью Modal BS4

0 голосов
/ 23 ноября 2018

Я пытаюсь изменить предварительное подтверждение dropzone с модальным подтверждением от начальной загрузки с этим кодом:

Modal: 

<div class="modal inmodal fade" id="RemoveFileModal" role="dialog" aria-hidden="true">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content animated bounceInRight">
                        <div class="modal-header errormdg">
                            <button type="button" class="close" data-dismiss="modal"><i class="fas fa-window-close text-white"></i><span class="sr-only">Close</span></button>
                            <h4 class="modal-title">Cuidado: Estas Intentando Remover un Archivo.</h4>
                        </div>
                        <div class="modal-body">
                            <p>
                                Por algún motivo el sistema detecto que intentaste Remover un Archivo, Ten en cuenta que el archivo removido no podrás subirlo al sistema.<br> Este aviso es para que tengas en cuenta que si aceptas el archivo que remueves no será guardado en la Aplicación.<br><br>
                                Presiona Aceptar para Remover el archivo y Salir de la pantalla.<br>
                                Presiona Cancelar para Regresar.<br>
                            </p>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-cls-error" id="outAceptar" data-dismiss="modal">Aceptar</button>
                            <button type="button" class="btn btn-white" data-dismiss="modal">Cancelar</button>
                        </div>
                    </div>
                </div>
            </div>

и использую этот скрипт для dropzone, чтобы поймать удалениеСобытие файла и отображение модального режима: 

 $('div.dropzone').each(function() {
            $(this).dropzone({
                autoProcessQueue: true,
                url: "/",
                maxFilesize: window.SIS.uploadFiles.size,
                maxFiles: window.SIS.uploadFiles.max,
                acceptedFiles: 'application/pdf, image/jpeg, image/jpg, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
                dictDefaultMessage: "<strong>Coloque los archivos Aqui. </strong></br> (Peso Maximo 2Mb, Se Aceptan los Siguientes Formatos: jpg, pdf, xls, xlsx.)",
                addRemoveLinks: true,
                dictCancelUpload: 'Cancelar Subida',
                dictRemoveFile: 'Quitar Archivo',
                clickable: true,
                init: function() {
                    this.on("removedfile", function(data) {
                        var IsRemove = false;
                        $('#RemoveFileModal').modal('toggle').on('click', '#outAceptar', function(e) {
                            IsRemove = true;
                        });
                        return IsRemove;
                    });
                },
            });
        });

Основная проблема заключается в том, что режим модального тогла не останавливает событие удаления файла, чтобы отловить, если пользователь нажимает «aceptar» или «cancelar».Испанский вариант принять и отменить.

скрипт показывает модальный режим, но продолжает удалять файл в фоновом режиме.

Обновление

Я пробовал с этим, ноне работает: 

removedfile: function(file) {
                $('#RemoveFileModal').modal('toggle').on('click', '#outAceptar', function(e) {
                    //myDropzone.removeFile(file);
                    return true;
                });
                $('#RemoveFileModal').modal('toggle').on('click', '#outCancelar', function(e) {
                    return false;
                });
            },

1 Ответ

0 голосов
/ 02 августа 2019

Хорошим способом является использование события удаленного файла: 

// Called whenever a file is removed.
removedfile: function removedfile(file) {
            $('#yourModalId').modal({
                backdrop: 'static',
                keyboard: false
            })

            $('#yourModalDeleteButton').click({file: file, self: this}, removeFile);

            function removeFile(event)
            {
                $('#yourModalId').modal('hide');
                // user confirmed , remove your file
            }
        },

Как вы можете видеть, я передаю объект файла и this моей функции, потому что вам потребуется по крайней мере объект файлаудалить файл.(Может быть, не это , это зависит от того, как вы справляетесь с удалением файла).

...