嗨,我想传递带有输入类型文件的formdata,但是我该怎么办呢?

时间:2019-01-18 12:32:32

标签: php jquery ajax laravel

在Laravel中更改输入类型文件以插入数据库时​​,我具有此功能。

$(document).on('change', '#galeria_imagen', function () {

    var elab = $('#elaboracion_ins').val();
    var formdata = new FormData();

    formdata.append("galeria_imagen", $('input[name=galeria_imagen]')[0].files[0]);

    console.log(prueba);
    $.ajax({
        type: 'POST',
        url: "/admin/elaboraciones/ajax/setGaleria",
        processData: false,
        data: formdata,
        success: function () {
            recargar_galeria(elab);
        }
    });
});

总是返回我“ 非法调用”,我放了ProcessData:false并且对我不起作用,因为不插入,在Laravel中我需要一个base64哈希值来插入文件

3 个答案:

答案 0 :(得分:0)

我们看不到您的HTML。但是我认为您将galeria_imagen设置为name而不是id,所以您将一无所获。另外,当您在处理程序中时,this上下文实际上是元素本身,因此您可以简单地执行this.files[0]

$(document).on('change', 'input[name="galeria_imagen"]', function() {
  var elab = $('#elaboracion_ins').val();
  var formdata = new FormData();

  formdata.append(this.name, this.files[0]);

  $.ajax({
    type: 'POST',
    url: "/admin/elaboraciones/ajax/setGaleria",
    processData: false,
    data: formdata,
    success: function() {
      recargar_galeria(elab);
    }
  });
});

答案 1 :(得分:0)

将multipart / form-data添加为mime类型

$(document).on('change', '#galeria_imagen', function () {

var elab = $('#elaboracion_ins').val();
var formdata = new FormData();

formdata.append("galeria_imagen", $('input[name=galeria_imagen]')[0].files[0]);

console.log(prueba);
$.ajax({
    type: 'POST',
    url: "/admin/elaboraciones/ajax/setGaleria",
    mimeType: "multipart/form-data",
    processData: false,
    contentType: false,
    data: formdata,

    success: function () {
        recargar_galeria(elab);
    }
});
});

答案 2 :(得分:0)

这是一个有效的样板-请参见http://jsfiddle.net/09o71yjc/

$('form.uploader input:file').on('change', function() {

    var data = new FormData();
    data.append('file', this.files[0]);

    $.ajax({
        url: $('.uploader').attr('action'),
        type: 'POST',
        dataType: 'json',
        processData: false,
        data: data,
        success: function () {
            alert('Uploaded')
        }
    });
});