Вопрос по json, ajax, php, jquery – Как я могу загрузить файл, используя функцию $ .ajax jquery с json и php

1

Я пытаюсь загрузить файл с помощью jQuery$.ajax функция, но не получила никакого вывода. Кто-нибудь, пожалуйста, помогите мне решить это. Я не знаю, правильный ли этот сценарий. Мой сценарий:

<code>$.ajax({
  url:'newsup.php',
  data: "",
  type: 'POST',
  contentType:'multipart/form-data',
  dataType: 'json',
  catche: 'false',

  success:function(data6)
  {
    $("#disp").removeClass().addClass((data6.error=== false)? 'success':'error').html(data6.msg).fadeIn('fast');
    //dele();
    if($("#disp").hasClass('success'))
    {
      alert("success");
      setTimeout("$('#disp').fadeOut('slow')",3000);            
    }
  },

  error:function(XMLHttpRequest,textStatus,errorThrown)
  {
    $("#disp").removeClass().addClass('error').html("There was an <strong>"+errorThrown+"</strong> error due to  <strong>"+textStatus+" condition").fadeIn('fast');
  }              

});
</code>

Также мне нужна помощь в получении данных из поля загрузки файлов с помощью jQuery.

Существует популярный и хорошо протестированный плагин jquery, если вы можете его использовать,github.com/blueimp/jQuery-File-Upload Juzer Ali
Мне не интересно использовать какой-либо из плагинов. Я просто хочу самое простое решение для загрузки файла через функцию $ .ajax. JOE
Вы сделали Google для этого? Я надеюсь, что будет много полезных результатов. Один из техphpletter.com/Demo/AjaxFileUpload-Demo Selvakumar Ponnusamy
катче? , это должно быть "Cache" , может быть опечатка? Ravi Gadag
Смотриplupload.com) для примера загрузки формы в стиле AJAX. Отправить форму с файлом с помощью обычного сообщения на одной странице очень сложно без использования встроенного фрейма для отправки невидимой формы. Plupload также довольно хорошо интегрируется с jQuery (по крайней мере, таков был мой опыт). Los Frijoles

Ваш Ответ

7   ответов
2

Примечание: нечетный синтаксис оператора for просто устанавливает & quot; f & quot; в массив [i] экземпляр.

        $("#submit").click(function () {
            var formData = new FormData();
            for (var i = 0, f; f = fileArray[i]; i++) {
                formData.append("opmlFile", f);
            }
            $.ajax({
                url: "/Documents/SaveFiles/" + @Model,
                type: "POST",
                data: formData,
                cache: false,
                contentType: false,
                processData: false
            })
            .error(function (xhr, status, error) {
                $.notify(error, true);
            })
            .success(function (data, status, xhr) {
                $.notify("Success");
            });
        });

К сожалению, я не помню, от какой статьи я получил это, но это был кто-то еще в переполнении стека.

6


По моему мнению, этот плагин является лучшим решением для этого. Вам не нужно помнить все опции и т. Д. Просто замените ваш ajax. на «ajaxForm».

Пожалуйста, прочитайте примеры ниже
http://jquery.malsup.com/form/#ajaxForm

@JOSEPHPAUL var data = & quot; formdata = data & quot ;; должна быть глобальной переменной, потому что $ (document) .ready (function () {..} это означает, что вы находитесь в другой области видимости
Я люблю этот плагин. Я использую его на каждом веб-сайте, который я разрабатываю. Нет смысла тратить время на AJAX вручную, когда этот плагин чертовски хорошо с ним справляется.
@JOSEPHPAUL Вы можете предоставить больше информации? (Ваш код)
Как ниже, я могу передать данные, хранящиеся в переменной данных, вajaxForm функционировать?var data="formdata=data"; $(document).ready(function() { var options={ Target: '#output1', url: url, data: data}; $('#myform1').ajaxForm(options); }); JOE
Я пробовал плагин malsups $ ajaxForm, но я не могу передать данные, которые я хранил в переменной,$ajaxForm() функция. Это работает только путем получения данных непосредственно из формы, как$('#myForm1').ajaxForm(options); , Как я могу преодолеть эту проблему. JOE
1

  $('#btnUploadFile').on('click', function () {
                var data = new FormData();
                var files = $("#fileUpload").get(0).files;

                // Add the uploaded file content to the form data collection
                if (files.length > 0) {
                    data.append("upload", files[0]);
                }

                // Make Ajax request with the contentType = false, and procesDate = false
                var ajaxRequest = $.ajax({
                    type: "POST",
                    url: "/api/documents",
                    contentType: false,
                    processData: false,
                    data: data,

                    error: function (xhr, status, error) {
                        console.log(xhr);
                        console.log(status);
                        console.log(error);
                        console.log(data);
                    }
                });

                ajaxRequest.done(function (xhr, textStatus) {
                    $("#response").attr('class', "alert alert-success");
                    $("#response").html("File uploaded successfully");
                });


            });
Привет, как вы одновременно загружаете и изображение, и данные?
@ gayan1991 Вы можете создать запрос / форму типаmultipart/form-data, увидетьstackoverflow.com/questions/4526273/… также это может быть полезно
1

Плагины для загрузки файлов Jquery 1 или жеПлагины для загрузки файлов Jquery 2 и в этом сценарии нет ошибок.

Надеюсь, поможет

Спасибо, Рашид

1

акже поддерживается во всех основных браузерах, кроме IE8 / 9. Увидеть ниже

https://developer.mozilla.org/en-US/docs/Web/API/FormData

2

ajaxfileupload который в основном создает скрытую форму и загружает ваш файл динамически.

взглянутьВот и прочитайте ответ Оли

Я ценю ваш интерес к ответу на мой вопрос и спасибо за ваш ответ. JOE
0

отвращения действия формы по умолчанию

$('#form').submit(function(e) { return false; });

и получить файл на стороне сервера через

$_FILES['inputName'];

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