Съдържание
Когато имаме формуляри за събиране на данни на една страница HTML5 Освен че можем да приемаме данни с полета за тип въвеждане, можем да качваме и файлове, с това можем да ускорим зареждането на определени данни, които е невъзможно да бъдат изразени в текст или които могат да бъдат много дълги текстове, обичайно е да качвате изображение файлове или pdf файлове, тъй като тези два формата са много популярни, обаче с Аякс можем да качим почти всеки тип файл.Качване на файлове
Да се качвайте файлове с помощта на Ajax, трябва да създадем поле за тип файл във форма и в нашата рутина Аякс използвайте обект FormData с които ще събираме данните, за да можем да им дадем необходимия формат и да качим нашия файл на сървъра.
Предметът FormData трябва да се използва внимателно, тъй като все още може да има версии на браузъри, които не го поддържат напълно, но това е доста солидно решение.
Нека да видим в следния код как да направите основно качване на файл:
ПримерБанани:Ябълки:Череши:Файл:Обща сума:0 артикулаПодай формуляр
Когато включвате въвеждане на тип файл, обектът FormData автоматично прави уговорките, така че нашият файл да може да бъде качен на сървъра, на следното изображение можем да видим как браузърът интерпретира това:
За да видим напредъка на изкачването, ще използваме обекта XMLHttpRequest за да проверите състоянието на заявката Аякс:
ПримерБанани:Ябълки:Череши:Файл:Напредък:Обща сума:0 артикулаПодай формуляр
Ние сме дефинирали елемент напредък и с него XMLHttpRequest обект Можем да присвоим стойностите, докато качването напредва, в браузъра можем да го видим по следния начин:
Увеличете
