2013-12-07 13 views
6

Sto cercando di utilizzare dropzone.js per caricare immagini nella mia app ASP.NET MVC. Sono in grado di impostare la dropzone in modo programmatico, fare clic su di essa, selezionare l'immagine e quando faccio clic su "Apri" nella finestra di dialogo del file, l'azione corretta viene colpita nel controller. Tuttavia, HttpPostedFileBase torna sempre come null, quindi non posso fare nulla con l'immagine. Sul lato client, tuttavia, mostra correttamente la miniatura dell'immagine, anche se non riesco a ottenerla dal lato server.dropzone.js e il file MVC ASP.NET pubblicato sono nulli?

Questo è il codice HTML:

<div style="float:left;margin-right:2px;" id="mainImage"> 
    <img src="/images/AddImage_button.png" class="dz-message" /> 
</div> 

Questo è il codice js io chiamo dopo il doc è pronto:

var myDropzone = new Dropzone("div#mainImage", { url: "/Market/UploadImage" }); 

E questa è la chiamata all'azione all'interno del regolatore:

public ContentResult UploadImage(HttpPostedFileBase imageFile) 
{ 

    if (imageFile == null || imageFile.ContentLength == 0) 
    { 
    //..... 
    } 
} 

L'azione è stata eseguita ma imageFile è nullo. Qualcuno ha qualche idea? A proposito, la classe "dz-message" è stata aggiunta al segnaposto immagine all'interno della dropzone perché prima non era cliccabile. L'ho letto da qualche parte che era una correzione per quel problema e ha funzionato.

Qualche idea del motivo per cui ottengo null per imageFile?

+4

predefinito nome del parametro che Dropzone usa è 'file', e il vostro è 'imageFile'. Cambia 'imageFile' in' file' e funzionerà allo – Catalin

+0

. Grazie! – user2623997

+0

@RaraituL postalo come risposta .... è un buon aiuto per principianti come me –

risposta

3

Il nome del parametro predefinito utilizzato da Dropzone è file e il proprio è imageFile. Cambia imageFile a file e funzionerà

0

C'è un piccolo aggiustamento che potresti perdere.

mi è successo un sacco di volte,

L'elemento di modulo si utilizza, deve avere è enctype attributo impostato in questo modo:

<form action="~/Home/SaveUploadedFile" method="post" enctype="multipart/form-data"/>