Отправка multipart/form-data используя jQuery ajax

Тема в разделе "JavaScript", создана пользователем Maza, 5 авг 2012.

Модераторы: ZiX
  1. Maza

    Maza

    Регистр.:
    3 июл 2007
    Сообщения:
    255
    Симпатии:
    118
    Подскажите как отправить изображение на сервер вместе с POST параметрами. Пытался сделать так, но не работает.
    HTML:
    <script>
        function ajax_send (ajdata,ajecho){
            $.ajax({
                type: 'POST',
                enctype: 'multipart/form-data',
                url: 'add.php',
                cache: false,
                contentType: false,
                processData: false,           
                data: ajdata,
                success: function(html){
                    $(ajecho).fadeOut(100 , function(){ $(this).html(html); }).fadeIn( 500 );
              }
            });
           
            return false;
        }
       
        $(document).ready(function(){
            $('#add_data').submit(function(){
                var photocheck = ($('#photo_check').is(":checked")) ? 'ok' : 'no';
                var data = new FormData();
                data = $("#photo")[0].files[0];
               
                return ajax_send('photo_check='+photocheck+'&photo='+data+'&add=adddata','div#content_reg');
            });
           
        });
    </script>
    В приложении исходник. Читал, что можно ещё с помощью плагина jquery.form.js, но так и не допёр, как подскажите, кто сталкивался уже с этим.
     

    Вложения:

    • JqA.rar
      Размер файла:
      35,9 КБ
      Просмотров:
      4
  2. antiterror

    antiterror xProgramming

    Регистр.:
    22 авг 2007
    Сообщения:
    344
    Симпатии:
    135
    Я тоже долго старался и перерыл интернет, но нужный код к сожалению не получилось .
    Пришлось использовать дополнительные плагины на jquery
    - http://blueimp.github.com/jQuery-File-Upload/
    - http://valums.com/ajax-upload/ (я сам использую эту версию) если немного поработать то можно полностью переделать под себя, что я и советую)

    ПС: если найдётся способ отправки через функцию AJAX, то мне тоже интересно будет посмотреть на код)
     
    Maza нравится это.
  3. Maza

    Maza

    Регистр.:
    3 июл 2007
    Сообщения:
    255
    Симпатии:
    118
  4. lesha20

    lesha20 Писатель

    Регистр.:
    8 сен 2012
    Сообщения:
    5
    Симпатии:
    1
    Это секретная информация, зачем прятать под hide?
     
  5. joker13

    joker13 Создатель

    Регистр.:
    13 ноя 2012
    Сообщения:
    10
    Симпатии:
    6
    Можно попробовать обернуть file input в форму и использовать сериализацию формы в JS.
    var serializedForm=$('#form').serialize();
    И отправить эту переменную в data. Сериализация должна помочь в корректной отправке изображения.
     
  6. lesha20

    lesha20 Писатель

    Регистр.:
    8 сен 2012
    Сообщения:
    5
    Симпатии:
    1
    Последнее редактирование: 26 фев 2017