2014-05-24 12 views
5

Ho bisogno di verificare se un file ha un tipo MIME valido, se la dimensione del file è ok e se le sue dimensioni sono ok, quindi caricare il file.Come mostrare un messaggio di errore personalizzato in DropzoneJS?

Così, quando tutto è OK, posso usare:

complete: function(file){ 
    // do something here. 
} 

ma cosa succede se la dimensione del file è stato valido? Nel mio script PHP torno un messaggio di errore:

return json_encode(['error' => 'size is invalid']); 

O

return Response::json(['error' => 'size is invalid'], 500 ]; 
// this is Laravel 4 syntax. returns a json array and 500 as status code. 

Ma come posso gestire tale error in DropzoneJS?

Ho provato ad aggiungere un secondo parametro alla funzione complete() ma non funziona.

complete: function(file, response){ 
    console.log(response); // this does not work. 
} 

risposta

7

per ottenere la risposta dopo che il file è stato sottoposto ad un uso server di questo DropzoneJS:

success: function(file, response) { 
    alert(response); 
} 

E per convalidare il file prima di caricarlo utilizzare questo:

complete: function(file) { 
    if (file.size > 3.5*1024*1024) { 
    alert("File was Larger than 3.5Mb!"); 
    return false; 
    } 

    if(!file.type.match('image.*')) { 
    alert("Upload Image Only!"); 
    return false; 
    } 
} 

Se la vostra il server sta restituendo response in JSON, sarà necessario utilizzare JSON.parse prima di alert.

Spero che ti possa aiutare! Saluti! :)

+2

Giusto per aggiungere qualcosa che penso è utile: si dovrebbe ascoltare gli eventi (http://www.dropzonejs.com/#toc_8) non riscriverlo (https://github.com/enyo/dropzone/issues/297). Saluti! :) – amandasantanati

+0

@amandasantanati Che davvero bello, ti permetterà di aggiungere più funzionalità. +1 per i collegamenti. –

1

Giusto per semplificare ciò @amandasantanati detto così non si fa clic in giro:

Non pratico complete: ... ma invece:

init: function() 
    { 
     this.on("complete", function(file) { 
      if (file.size > 3.5*1024*1024) { 
       this.removeFile(file); 
       alert('file too big'); 
       return false; 
      } 

      if(!file.type.match('image.*')) { 
       this.removeFile(file); 
       alert('Not an image') 
       return false; 
      } 
     }); 
    }, 
1

Impostare il codice di risposta HTTP http_response_code (415) ; // Tipo di supporto non supportato o http_response_code (415); // Non accettabile

function showError($message) 
    { 
     http_response_code(415); 
     die($message); 
    } 

enter image description here

Problemi correlati