AJAX - enviar un archivo mediante ajax

   
Vista:

enviar un archivo mediante ajax

Publicado por sair (5 intervenciones) el 22/02/2018 01:44:32
Hola estimados amigos.

Necesito su apoyo, estoy intentado subir un archivo (puede ser pdf, png, xml, etc) a un servicio mediante un ajax, tengo la sig estructura:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
function archivo_tipo(){
   // if submit button is clicked
    var Archivo = $("input#archivo").val(); // define username variable     
    var data = new FormData();
 
    //var json_param = JSON.stringify({"id_recurso": '189', "clave_proyecto": NoProyecto});
    $.ajax({// JQuery ajax function
        type: "POST", // Submitting Method
        url: ip+'/conacyt-war/resources/conacyt/exportar/exportarArchivo',
        //enctype: 'multipart/form-data',
        data: Archivo, //'{\"usuario\":\"'+ username + '\",\"pass\":\"' + password+'\"}',      
        processData: false,
        contentType: false,
        //dataType: 'html', // type of returned data
        success: function (data) {
            if (data[0].exportarArchivo === -1) {
 
                bootbox.alert("No existe el proyecto");
 
            } else {
 
                $('#nombre_archivo').val(data[0]["nombre_archivo"]);
                $('#ruta').val(data[0]["ruta"]);
 
            }
 
            //impresion valores en pantalla de registro de proyecto
 
        },
 
        error: function () {
            alert("archivo cargado de manera incorrecta");
        }
    })
 
    return  false;
}


del lado del jsp tengo lo sig:

1
2
3
4
5
6
7
8
9
10
11
12
13
<div class="panel-body">
    <div class="row">
        <div class="col-lg-6">
            <div class="form-group">
                <br/><label>Proyecto</label>
                <input type="file" id ="archivo"  onchange="archivo_tipo();" style="width:300px"></input>
                <input type="hidden" name="nombre_archivo" id="nombre_archivo" value="" readonly="readonly" />
                <input type="hidden" name="ruta" id="ruta" value="" readonly="readonly" />
                <span class="help-block"> </span>
            </div>
        </div>
    </div>
</div>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

enviar un archivo mediante ajax

Publicado por xve (207 intervenciones) el 22/02/2018 08:46:10
Hola Sair, y exactamente que problema tienes? o que error te da?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

enviar un archivo mediante ajax

Publicado por sair (5 intervenciones) el 22/02/2018 16:44:35
me marca que el ajax no soporta el archivo (mediante el console) y el archivo dentro de ajax esta null
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

enviar un archivo mediante ajax

Publicado por Yamil Bracho (183 intervenciones) el 22/02/2018 16:49:52
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

enviar un archivo mediante ajax

Publicado por sair (5 intervenciones) el 22/02/2018 18:30:17
El ejemplo utiliza Iframe, no lo puedo incorporar. Pero muchas gracias.

Realicé otra prueba pero manda lo mismo

del lado del js:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
$(document).ready(function () {
 
$("#enviar_doc").click(function () {
    var formData = new FormData();
        formData.append("file", "archivo");
        var pdfsComprobantes = document.getElementsByName("archivo");
        //var idsComprobantes = document.getElementsByName("id_comprobantes");
        //console.log(idsComprobantes);
        var nums=pdfsComprobantes.length;
        //console.log("nums:"+nums);
        for (var l = 0; l < nums; l++) {
            //console.log(pdfsComprobantes[l].files[0]);
            formData.append("pdf_comprobantes[]", pdfsComprobantes[l].files[0]);
            //formData.append("ids_comprobante[]", idsComprobantes[l].value);
        }
 
        $.ajax({
            type: "POST",
            url: ip+'/conacyt-war/resources/conacyt/exportar/exportarArchivo',
            data: formData,
            dataType: "json",
            async: false,
            contentType: false,
            processData: false,
            cache: false,
            success: function (data) {
                    if (data[0].exportarArchivo === 1) {
 
                    bootbox.alert("No existe el proyecto");
 
                } else {
 
                    $('#nombre_archivo').val(data[0]["nombre_archivo"]);
                    $('#ruta').val(data[0]["ruta"]);
 
 
                }
                },
 
            error: function () {
                alert("archivo cargado de manera incorrecta");
            }
        });
 
});
});

del lado del jsp

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<div class="panel-body">
    <div class="row">
        <div class="col-lg-6">
            <div class="form-group">
                <br/><label>Proyecto</label>
                <form id="form1" method="post" enctype="multipart/form-data" action="">
                    <input type="file" id ="archivo" name="archivo" style="width:300px"></input>
                    <input type="hidden" name="nombre_archivo" id="nombre_archivo" value="" readonly="readonly" />
                    <input type="hidden" name="ruta" id="ruta" value="" readonly="readonly" />
                    <button type="button" class="btn" id="enviar_doc">Guardar</button>
                    <span class="help-block"> </span>
                </form>
            </div>
        </div>
    </div>
</div>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Revisar política de publicidad