dropzonejs와 함께 파일로 양식 데이터 보내기

dropzonejs를 사용하여 파일을 s3 버킷에 업로드했습니다.dropzonejs와 함께 파일로 양식 데이터 보내기

이제 제출 버튼에도 일반 게시물이 필요합니다. 하지만 form_post에는 $ _FILES이 포함되어 있지 않습니다.

DROPZONE 코드 : ----

Dropzone.autoDiscover = false; 
var myDropzone = new Dropzone(".dropzone", { 
    url: '<?php echo base_url('app/attachments')?>', 
    maxFiles:1, 
    method:'post', 
    paramName:'attachment', 
    uploadMultiple:false, 
    addRemoveLinks:true, 
    params:{pg_tn:$('#pg_tn').val()},   
    acceptedFiles:".csv,.xls,.xlsx", 
    //acceptedFiles:"image/jpeg,image/png,image/gif,application/msword,application/vnd.oasis.opendocument.text", 
    autoProcessQueue:true, 
    maxFilesize:25, 
    timeout:120000 
    }); 
    myDropzone.on("success", function(file,response) { 
    var res=JSON.parse(response); 
    console.log(res); 
    $('#attachment_id').val(res.attachment_id); 
    }); 
    myDropzone.on("removedfile",function(file){ 
     $('#attachment_id').val(''); 
    });

form_post 코드 : - 당신이하지에 구성하지 않는 한 즉시

var form = $('#ecommerce_frm')[0]; 
var data = new FormData(form); 
$("#btnSubmit").prop("disabled", true); 
    $.ajax({ 
     type: "POST", 
     enctype: 'multipart/form-data', 
     url: "<?php echo base_url('ecommerce/uploadsalesheet');?>", 
     data: data, 
     processData: false, 
     contentType: false, 
     cache: false, 
     timeout: 600000, 
     success: function (data) { 

     }, 
     error: function (e) { 

     } 
    }); 

});

출처

2017-10-28 Rajeev Ranjan

DROPZONE POST를 파일. 성공적으로 게시되면 처리되고 완료된 것으로 간주되므로 양식에서 제거됩니다.

다른 양식 데이터로 POST하려는 경우 가장 좋은 방법은 자동 처리를 사용하지 않도록 설정하여 양식을 제출할 때까지 파일이 게시되지 않도록하는 것입니다. 파일과 양식 값이 동일한 URL 인 동일한 처리기에 게시된다는 것을 의미합니다. ecommerce/uploadsalesheet과 app/attachments 메서드를 단일 메서드로 결합해야 파일과 데이터를 포함하는 POST를 처리 할 수 있습니다.

먼저 DROPZONE 옵션에서 자동 처리를 사용하지 않도록, 그렇게하려면, 당신은 당신의 버튼을 클릭하면

autoProcessQueue = false,

그런 다음 파일을 수동으로 처리합니다. 귀하의 코드는 표시되지 않습니다하지만 난 할 그 핸들러 내부 있도록 you'e가 $("#btnSubmit").on('click', function() {...})에 싸여 또는 유사한되어 표시된 $.ajax() 코드를 추측 :

myDropzone.processQueue();

당신은 지금 너무 모든 $.ajax() 코드를 제거해야합니다 Dropzone은 이제 POST를 수행하고 있으므로 필요하지 않습니다. 특정 성공 또는 실패 처리를 Dropzone's appropriate event handlers으로 옮겨야합니다.

다음 문제는 다른 모든 양식 필드가 파일과 함께 전송되지 않는다는 것입니다. 왜냐하면 Dropzone은 파일에 대해 알지 못하기 때문입니다. 나는 params 옵션이 뭔가처럼 그렇게 할 수 있다고 생각 :

params: $('#ecommerce_frm').serialize(),

내가 전에 params를 사용하여 시도하지 않은,하지만 그것이 작동하지 않는 경우,이 않습니다 - 당신은 DROPZONE의 sending 콜백을 사용하여 수동으로 폼 값을 추가 할 수 있습니다 :

출처

2017-10-28 13:37:40

다른 URL로 양식 데이터를 다시 보내려면 버튼 클릭시 하나의 아약스 통화가 있어야합니다. 이고 form-data에 $ _FILES가 포함되어 있지 않은 문제가 있습니다. –

@RajeevRanjan 네, 버튼 클릭은 현재 AJAX 호출을합니다. Dropzone은 또 다른 AJAX POST를 수행합니다 (AJAX 호출 전에 발생합니다). 내 대답은 그들을 1 POST로 결합하는 방법을 설명합니다. –

내 요구 사항은 그들을 결합 할 수 없습니다, 나는 어떻게 dropzonejs works.May 내 요구 사항을 설명 할 수 있을지 모르겠다. –

dropzonejs와 함께 파일로 양식 데이터 보내기

답변

관련 문제