Отправка файла post'ом с помощью jQuery
Объект FormData позволяет составить набор пар ключ/значение для отправки при помощи XMLHttpRequest. Это, в первую очередь, предназначено для отправки данных форм, но вы можете использовать этот объект независимо от форм, тогда передаваемые данные будут в том же формате, что и при обычной отправке формы с enctype="multipart/form-data". Но при попытке отправки Объекта FormData через jquery $.ajax возникают проблемы, т.е. запрос придет, но файл вы не получите. Все это из-за 2 параметров которые в jquery ajax включены по умолчанию.
processData: true ; // по умолчанию |
По умолчанию, данные, переданные в параметр data в качестве объекта (с технической точки зрения, что-либо кроме строки), будут обработаны и преобразованы в строку запроса, для соответствия типу данных по умолчанию — «application/x-www-form-urlencoded; charset=UTF-8». Если необходимо отослать документ DOM или другие специфические данные, то установите данную опцию в false.
contentType: true ; // по умолчанию |
При отсылке данных на сервер, указывает тип данных. По умолчанию: «application/x-www-form-urlencoded», что подходит для большинства случаев.
Далее пример отправки файла:
Форма:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<form method= "post" action= "" enctype= "multipart/form-data" > <input type= "text" name= "s_name" /> <label for = "name" >Имя :</label> <input type= "text" name= "name" /> <label for = "mail" >e-mail :</label> <input type= "text" name= "mail" /> <label for = "text" >Сообщение:</label> <textarea name= "text" /> <input type= "file" name= "ava" /> <div id= "submit" >Отправить</div>ev </form> |
Скрипт :
1
2
3
4
5
6
7
8
9
10
11
|
var formData = new FormData($( 'form' )[0]); $.ajax({ type: "POST" , processData: false , contentType: false , url: "some.php" , data: formData }) .done( function ( data ) { }); |