jQuery - получение массива $ _FILES с использованием $ .post - PullRequest
Новая
       16

jQuery - получение массива $ _FILES с использованием $ .post

6 голосов
/ 16 февраля 2009

Я пытаюсь отправить форму через jQuery. Моя форма содержит поля и файл, который необходимо загрузить. Это типа ENCTYPE="multipart/form-data".

Я могу получить все значения моего поля, используя: post = $('#myForm').serialize(); Но как мне получить массив $_FILES? Мне нужно это для обработки загруженного файла.

Возможно ли это с помощью jQuery, и если да, то как? Или мне нужно использовать специальный плагин для загрузки jQuery?

Ответы [ 6 ]

12 голосов
/ 16 февраля 2009

Форма запроса - лучший способ сделать это, Вы можете добавить его в любую нормальную форму, 

<form method="post" action="URL">
<input type="file" name="file">
<input type="text" name"text">
<input type="submit"> 
</form>

<script type="text/javascript">
$(document).ready(function() { 
  $(form).ajaxForm();
})
</script>

будет работать как положено, но с ajax.

http://malsup.com/jquery/form/#code-samples

11 голосов
/ 16 февраля 2009

Вы не можете загружать файлы через JavaScript.

Проверьте этот связанный вопрос:
Можно ли использовать Ajax для загрузки файлов?

По сути, двумя наиболее популярными способами «подделки» AJAX для загрузки файлов является использование плагина Flash, такого как SWFUpload , или отправка формы в скрытый iframe, обрабатывающий запрос.

1 голос
/ 13 апреля 2016

Использовать FormData 

<form>
<label for="imageToSend">Cargar imagen a la galeria</label>
<input type="file" name="imageToSend" id="imageToSend" value="Cargar imagen" />
</form>
<script>
$('#imageToSend').on('change',function(event){
    var dialog = $('#dialog');
    var Data = new FormData();
    Data.append('imageToSend',$('#imageToSend')[0].files);
    $(this).val('');//Clear input file
    $.ajax({
        url: "/upload",
        data: Data,
        processData: false,
        contentType: false,
        type:'POST',
        success: function(data){
            if(data.success){
                //success handler   
            }else if(!data.success){
                //error backend handler
            }
        },
        error: function(data){
            //error handler Ej:404 status
        }
    })
  });
</script>
1 голос
/ 17 ноября 2011

Форма содержит файл ввода, но отсутствует метод = POST и enctype = multipart / form-data в форме. Файл не будет отправлен

0 голосов
/ 05 февраля 2010

Возможно, но не работает в Google Chrome) Смотри! 

...
<form method='post' enctype='multipart/form-data'>
<input type="file" id="imf" name="imf"/>
<input type="button" id="Save"/>
</form>

...

$("#Save").live("click", function(){

var photo = document.getElementById("imf"); 
var file  = photo.files[0];

   $.post('/user/saveNewPhoto', {'imf':file.getAsDataURL(), fname:file.fileName }, function( data ){
   alert ( data );
    });

});

загрузить боковой скрипт нужно декодировать base64) и все но я не проверяю этот скрипт на файле большого размера

0 голосов
/ 16 февраля 2009

Если вы можете управлять средой, как, например, вы пишете приложение для администратора для интрасети, в котором вы рекомендуете браузер, тогда возможна настоящая загрузка файлов AJAX с Firefox 3 и выше. Во всех остальных случаях обходной путь iframe или загрузчик на основе Flash - это путь.

...