HTML5 - Încărcați fișiere

Când avem formulare de colectare a datelor pe o singură pagină HTML5 În afară de posibilitatea de a prelua date cu câmpuri de tip de intrare, putem încărca și fișiere, cu aceasta putem accelera încărcarea anumitor date care sunt imposibil de exprimat în text sau care pot fi texte foarte lungi, este obișnuit să încărcați imagini fișiere sau fișiere pdf, deoarece aceste două formate sunt foarte populare, totuși cu Ajax putem încărca aproape orice tip de fișier.
Încărca fișiere
La încărcați fișiere folosind Ajax, trebuie să creăm un câmp de tip fișier într-un formular și în rutina noastră Ajax folosiți un obiect FormData cu care vom colecta datele pentru a le putea oferi formatul necesar și a încărca fișierul nostru pe server.
Obiectul FormData trebuie utilizat cu grijă, deoarece pot exista în continuare versiuni ale browserelor care nu o acceptă pe deplin, totuși este o soluție destul de solidă.
Să vedem în următorul cod cum se face o încărcare de bază a fișierului:

 ExempluBanane:Mere:Cireșe:Fişier:Total:0 articoleTrimiteți formularul 

Când încorporați tipul de fișier de intrare, obiectul FormData face automat aranjamentele astfel încât fișierul nostru să poată fi încărcat pe server, în următoarea imagine putem vedea cum interpretează browserul acest lucru:

În acest caz, a fost o imagine destul de ușoară, astfel încât timpul de încărcare a fișierului pe server nu este vizibil, totuși, dacă ar fi un pdf de 30 MB, timpul ar fi mult mai lung, deoarece acest lucru este transparent pentru utilizator, el ar putea crede că pagina nu „face nimic” sau „gândește” pentru a evita acest lucru, putem încorpora o bară de progres cu care progresul devine vizibil.
Pentru a vedea progresul urcării vom folosi obiectul XMLHttpRequest pentru a verifica starea cererii Ajax:

 ExempluBanane:Mere:Cireșe:Fişier:Progres:Total:0 articoleTrimiteți formularul 

Am definit un element progres și cu el Obiect XMLHttpRequest Putem atribui valorile în timp ce încărcarea progresează, în browser o putem vedea după cum urmează:

MARI

Putem folosi Ajax Pentru mult mai mult decât consultarea elementelor din alte pagini, îl putem folosi și pentru a ne îmbunătăți formularele atunci când vine vorba de captarea datelor.V-a plăcut și ați ajutat acest tutorial?Puteți recompensa autorul apăsând acest buton pentru a-i oferi un punct pozitiv