如何通过带有多个参数的 jQuery AJAX 将文件发送到 MVC 控制器？答案

【问题标题】：How do I send files via jQuery AJAX with multiple parameter to an MVC controller?如何通过带有多个参数的 jQuery AJAX 将文件发送到 MVC 控制器？
【发布时间】：2018-08-30 17:02:05
【问题描述】：

enter code here我已经阅读了几个关于这个问题的答案，但没有一个有效。

我有以下代码，但我的 HttpPostedFileBase[] 数组始终为空。其他参数的值正确，但HttpPostedFileBase[] 始终为空。

我错过了什么？？

$('#myFile').on('change', function (e) {                                                                      
    var fileName = e.target.files[0].name;                                                                    

    archivosProcesar = new FormData();                                                                        

    for (var i = 0; i <= e.target.files.length -1; i++) {                                                     
        archivosProcesar.append(i, e.target.files[i]);                                                        
    }                                                                                                         
});                                                                                                           

function aplicarFragmentacion() {                                                                             
    var ids = obtenerAfiliadosSeleccionados();                                                                
    var data = {                                                                                              
        fragmento1: parseInt($('#fragmento1').val()),                                                         
        fragmento2: parseInt($('#fragmento2').val()),                                                         
        segmentos: ids,                                                                                       
        archivos: archivosProcesar                                                                            
    }                                                                                                         

    if (!validarProcentajes() & !validarSeleccionados(ids)) {                                                 
        $.ajax({                                                                                              
            data: data,                                                                                       
            url: urlAplicarFrag,                                                                              
            type: 'POST',                                                                                     
            processData: false,                                                                               
            beforeSend: function () {                                                                         
                //$("#resultado").html("Procesando, espere por favor...");                                    
            },                                                                                                
            success: function (data) {                                                                        
                onSuccessAplicarFragmentacion(data);                                                          
            },                                                                                                
            error: function (jqXHR, textStatus, errorThrown) {                                                
                console.log(jqXHR.responseText);                                                              
                onError(jqXHR.responseText);                                                                  
            }                                                                                                 
        });                                                                                                   
    }                                                                                                         
}

Controller.cs

public async Task<ActionResult> AplicarFragmentacion(decimal fragmento1, decimal fragmento2, string[] segment\
os, HttpPostedFileBase[] archivos)                                                                            
{                                                                                                             
    List<Credito> lstSegmentos = new List<Credito>();                                                         
    try                                                                                                       
        {                                                                                                     
            ProgressHub.SendMessage("Iniciando proceso de fragmentación...", 10);                             
            lstSegmentos = await FragmentacionNegocio.AplicarFragmentacion(fragmento1, fragmento2, segmentos)\
;                                                                                                             
        }                                                                                                     
    catch (Exception ex)                                                                                      
        {                                                                                                     
            throw new Exception(ex.Message);                                                                  
        }                                                                                                     

    return Json(lstSegmentos, JsonRequestBehavior.AllowGet);                                                  
}

【问题讨论】：

标签： javascript c# jquery asp.net-mvc visual-studio

【解决方案1】：

尝试提交 FormData 对象，而不是带有 FormData 字段的匿名对象。另外，我的理解是 contentType 应该设置为 false。

var formData = new FormData();
formData.append('fragmento1', parseInt($('#fragmento1').val());
formData.append('fragmento2', parseInt($('#fragmento2').val());
formData.append('segmentos', obtenerAfiliadosSeleccionados());
formData.append('archivos', $('#fileupload')[0].files[0]);

$.ajax({
      type: 'POST',
      data: formData,
      url: urlAplicarFrag,
      type: 'POST',
      processData: false,
      contentType: false,
      [...]
});

【讨论】：

感谢您的回答。我的控制器中有这个参数：HttpPostedFileBase formData。我尝试过以数组方式和单一对象方式。但它仍然是空的。 :(
档案库实际上是一个文件上传数组吗？如果您只提交单个文件上传，它是否有效？公共异步任务 AplicarFragmentacion（十进制fragmento1，十进制fragmento2，字符串[]段，HttpPostedFileBase档案）
haacked.com/archive/2010/07/16/… 建议您可以使用 IEnumerable 但尝试 1 个文件将是一个不错的起点。另外，如果您使用没有 jquery 的普通
提交，它是否有效？
谢谢，我可以用这个插件修复它jquery-form.github.io/form ...易于使用。作为另一个普通插件，带有选项和回调

【解决方案2】：

解决方法是使用这个插件

https://jquery-form.github.io/form/

这样

$(this).ajaxSubmit({
                url: urlAplicarFrag,
                data: {
                    fragmento1: parseInt($('#fragmento1').val()),
                    fragmento2: parseInt($('#fragmento2').val()),
                    segmentos: ids,
                    fechaReenvio: $('#fecha-reenvio').val()
                },
                success: function (data) {
                    onSuccessAplicarFragmentacion(data);
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    console.log(jqXHR.responseText);
                    onError(jqXHR.responseText);
                }
            });

检查插件网站

【讨论】：