В этой заметке хочу осветить интересный способ загрузки файлов на сервер. Срипт, который получится полностью рабочий и после некоторой адаптации может быть использован вами, в ваших проектах, если конечно будет вам интересен.

Да этот способ можно назвать "AJAX загрузка файлов на сервер", хотя он и не использует ни ActiveXObject ни XMLHttpRequest , тем не менее это то, что в последствии превратилось в AJAX. Вообще, здесь я раскрою несколько трюков разработки, которые будут довольно неплохой находкой для начинающих.

Во первых метод использует динамически добавляемые/удаляемые поля загрузки файлов (листинг JavaScript прилагается) - т.е. в данной заметке рассматривается загрузка и обработка неопределённого множества файлов на сервер, и как всегда я стараюсь писать как можно лаконичнее и понятнее.

Во вторых, конечно всё будет происходить, именно без перезагрузки страницы .

В третьих будет дан серверный скрипт, который принимает данные, выводит информацию, и обрабатывает ошибки загрузки файлов

И в четвёртых, в конце загрузки файлов, пользователю будет выведена информация о том, какие файлы загрузились, а какие нет, и почему. В общем ценная штука в арсенале разработчика.

Как мы уже знаем, при написании html форм атрибуты "name" - элементов формы, впоследствии являются ключами глобальных массивов: $_REQUEST $_GET или $_POST и если в форме будут два поля с одинаковым атрибутом "name" то значение последнего поля "затрёт" значения предыдущих в глобальном массиве. Т.е. если у нас есть следующее:

То в обрабатывающем скрипте ма увидим массив $_FILES, котором будет только один ключ "upfile", а значение первого поля с id="one" - затрётся.

Решается такая проблема банально просто: даём разные имена атрибутам "name" и "id". Но! Что делать, если поля для загрузки файлов должны добавляться динамически, и их количество заранее не известно? Как правило программисты предпочитают генерировать подобные вещи в цикле, добавляя к атрибуту "name" некий числовой суффикс, добиваясь тем самым уникальности атрибута "name", а атрибут id за редким исключением почти всегда можно опустить (Вспоминаем методы DOM для доступа к элементам) Серверный скрипт генерации формы может иметь следующий вид: