pashakiz
@pashakiz
web dev

Как отправить HTML-форму с файлом без перезагрузки страницы?

На jQuery Ajax'ом через serialize() не выходит, да и как я понял - нельзя.

Есть ли смысл использовать FormData?
Насколько я понял, он не очень хорошо поддерживается браузерами... Может есть на него костыли для неподдерживаемых браузеров?

Есть еще кроссбраузерные варианты?
Что-то слышал про метод с iframe, но так и не понял до конца, где должен быть этот iframe?

P.S. Кстати, поправьте меня, если я не прав: файл нельзя отправить методом get, верно?
  • Вопрос задан
  • 614 просмотров
Решения вопроса 2
In4in
@In4in
°•× JavaScript Developer ^_^ ו°
В гугле забанили? ©Народная мудрость

Дави сюда

Но такой вариант пройдет только с IE9+.

Что-то слышал про метод с iframe, но так и не понял до конца, где должен быть этот iframe?


Пофантазирую:
  • Берем iframe, кладем на страницу, скрываем
  • Во фрейме форма
  • При выборе файла в видимой форме на главной странице, подменяем данные в форме, что внутри фрейма, отправляем ее (onsubmit).
  • Profit!


-
P.S. Кстати, поправьте меня, если я не прав: файл нельзя отправить методом get, верно?


В теории - можно, но только вес отправляемых данных будет куда больше, так как GET кодирует их по своему, да и кол-во символов в итоге не должно превышать 255.
Ответ написан
Комментировать
@ingwar4ik
<form id="Form">
    <input type="file" />
    <input type="submit" value="Send" id="buttonSubmit">
</form>

$(document).ready(function () {
		$("#buttonSubmit").bind("click", function (event) {
			$('#Form').submit();
			return false;
		});

		$('#Form').submit(function(e) {
		    var formData = new FormData(this);
		    $.ajax({
		        type:'POST',
		        url: '/url',
		        data:formData,
		        cache:false,
		        contentType: false,
		        processData: false,
		        success:function(data, status){

		        },
			      error: function (jqXHR, exception) {

			      }
		    });
		    e.preventDefault();
		});
});
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы