我不能使用Ajax上传图像

i can't upload images using Ajax

本文关键字：图像 Ajax 不能      更新时间：2023-09-26

我一直在尝试使用ajax和bootstrap (modal)添加新产品，当我按下save changes按钮时，我在所有字段中获得Undefined index。

这是我的ajax代码: 
$('#save').click(function(){
    var nombre = $('#nombre').val();
    var desc = $('#desc').val();
    var precio = $('#precio').val();
    var stock = $('#stock').val();
    var tipo = $('#tipo').val();
    var data = new FormData();
    jQuery.each(jQuery('#imagen')[0].files, function(i, file) {
        data.append('file-'+i, file);
    });
    var datas="nombre="+nombre+"&desc="+desc+"&precio="+precio+"&stock="+stock+"&tipo="+tipo;
    $.ajax({
        url: "php/newproduct.php",
        data: {datas, data},
        cache: false,
        contentType: false,
        processData: false,
        type: "POST"
    }).done(function( data ) {
        $('#info').html(data);
        viewdata();
        setTimeout(function() {
            $('#myModal').modal('hide');
        }, 500);
        $('.modal').on('hidden.bs.modal', function(){
            $(this).find('form')[0].reset();
        });
    });
});

data: {datas, data},

似乎不是正确的javascript语法，我认为你不能混合不同的数据对象。
你不能混合FormData和URL编码字符串，这在你的情况下不是事件正确编码，你会有问题，如果任何值包含&。

使用AJAX上传的最简单的方法是，如果用form初始化FormData对象 
var data = new FormData($("#form").get(0));

然后只使用

data: data,
在AJAX调用 中的

如果您确实需要手动添加字段，则需要将它们添加到FormData对象

data.append("nombre", nombre);
data.append("desc ", desc);
data.append("precio ", precio);
data.append("stock ", stock);
data.append("tipo ", tipo);
相关文章：