Controllo FileUpload all’interno di un UpdatePanel senza aggiornare l’intera pagina?

Secondo Microsoft, il controllo FileUpload non è compatibile con un AJAX UpdatePanel.

Sono consapevole che un PostBackTrigger può essere aggiunto al pulsante di invio del modulo in questo modo:

   

Il problema è che questo costringe il modulo a eseguire un postback completo che elimina l’intero punto di utilizzo di UpdatePanel in primo luogo. C’è una soluzione alternativa a questo problema che non causa l’aggiornamento dell’intera pagina?

Conosco un componente di terze parti che può farlo. Si chiama ” swfupload ” ed è gratuito da usare e open source, e usa javascript e flash per fare la magia.

ecco un elenco delle funzionalità che offrono: (dal loro sito)

  • Carica più file contemporaneamente con ctrl / shift-selezionando nella finestra di dialogo
  • Callback Javascript su tutti gli eventi
  • Ottieni informazioni sui file prima che inizi il caricamento
  • Stile caricare elementi con XHTML e css
  • Visualizza le informazioni mentre i file vengono caricati utilizzando HTML
  • Non è necessario ricaricare la pagina
  • Funziona su tutte le piattaforms / browser che supportano Flash.
  • Degrada con garbo al normale modulo di caricamento HTML se Flash o javascript non sono disponibili
  • Controlla la dimensione del file prima dell’inizio del caricamento
  • Mostra solo i tipi di file scelti nella finestra di dialogo
  • Carica le code, rimuovi / aggiungi file prima di iniziare il caricamento

Hanno anche un’area demo dove puoi giocare con il loro controllo. In questo modo puoi essere certo che sia esattamente ciò che desideri.

L’abbiamo usato in uno dei nostri progetti e non ci ha mai deluso fino a oggi, quindi penso che sia una scommessa sicura.

oh e qui c’è la pagina di download: http://code.google.com/p/swfupload/

Non è ansible caricare i file tramite AJAX solo ricaricando un intero documento HTML . Dovresti usare iframe se preferisci HTML puro (questo è più comune, ad esempio usato da WordPress) o qualcos’altro come swfupload suggerito da Sven.

Aggiungi questo al tuo controllo pulsante:

 OnClientClick="javascript:document.forms[0].encoding = 'multipart/form-data';" 

-o-

Rendi la tua pagina Il tag modulo assomiglia a:

 

L’ho trovato l’altro giorno quando mi sono imbattuto nello stesso problema: http://vinayakshrestha.wordpress.com/2007/03/13/uploading-files-using-aspnet-ajax-extensions/ .

Per la mia implementazione, ho inserito l’iframe in un popup modale e ho aggiunto un pulsante con style = “display: none” per gestire la chiusura del popup. Nella funzione javascript che controlla la modifica nell’iframe, ho aggiunto document.getElementById (“<% = btnCloseUpload.ClientID%>“). Click (); per il pulsante nascosto.

Prova AJAX AsyncFileUpload. Funziona bene se utilizzato nella materia che si intende utilizzare (gestire l’evento UploadedComplete).

http://www.asp.net/AJAX/AjaxControlToolkit/Samples/AsyncFileUpload/AsyncFileUpload.aspx

Può usare IFrame avere un attributo “target” che menziona a FileUpload Page OPPURE usare l’esempio di Jquery al link Come rendere il caricamento di file asincrono (AJAX) usando iframe?

Il pulsante che UseSubmitBehavior l’evento di caricamento deve avere la proprietà UseSubmitBehavior impostata su false:

 clsUploadButton.UseSubmitBehavior = False;