ajax is not sending input files

Asked

Viewed 17 times

1

ajax is not sending values when adding

"arquivo1": arquivo1, //file imagem "arquivo2": arquivo2, //file imagem "arquivo3": arquivo3 //file imagem however if I remove the above code it sends the information to the database but does not send the images, how can I remove this problem and send the images along with the rest of the information ?

$(function() {
    $(document).ready(function() {
        $("#btn").click(function() {

            var cont_nav_1 = $("#homeInput").val();
            var titulo_slide_1 = $("#tituloSlideInput1").val();
            var texto_slide_1 = $("#textoSlideInput1").val();
            var titulo_slide_2 = $("#tituloSlideInput2").val();
            var texto_slide_2 = $("#textoSlideInput2").val();
            var titulo_slide_3 = $("#tituloSlideInput3").val();
            var texto_slide_3 = $("#textoSlideInput3").val();
            var titulo_acima_slide = $("#tituloInput").val();
            var titulo_menu_suspenso_1 = $("#tituloSuspensoInput1").val();
            var texto_menu_suspenso_1 = $("#textoSuspensoInput1").val();
            var titulo_menu_suspenso_2 = $("#tituloSuspensoInput2").val();
            var texto_menu_suspenso_2 = $("#textoSuspensoInput2").val();
            var titulo_menu_suspenso_3 = $("#tituloSuspensoInput3").val();
            var texto_menu_suspenso_3 = $("#textoSuspensoInput3").val();
            var id_usuario = $("#id_usuario").val();
            var arquivo1 = $("#imageSlideInput1").val();
            var arquivo2 = $("#imageSlideInput2").val();
            var arquivo3 = $("#imageSlideInput3").val();

            $.ajax({
                beforeSend: function() { //Antes de enviar o AJAX
                    $(".loading").append('<img id="loading" style="width: 600px;" src="../img/loading.gif">');
                },
                url: 'criar_tema_1_back.php', //URL solicitada
                type: 'POST', //Tipo de envio (POST ou GET)
                cache: false,
                contentType: false,
                processData: false,
                data: FormData{
                    "cont_nav_1": cont_nav_1,
                    "titulo_slide_1": titulo_slide_1,
                    "texto_slide_1": texto_slide_1,
                    "titulo_slide_2": titulo_slide_2,
                    "texto_slide_2": texto_slide_2,
                    "titulo_slide_3": titulo_slide_3,
                    "texto_slide_3": texto_slide_3,
                    "titulo_acima_slide": titulo_acima_slide,
                    "titulo_menu_suspenso_1": titulo_menu_suspenso_1,
                    "texto_menu_suspenso_1": texto_menu_suspenso_1,
                    "titulo_menu_suspenso_2": titulo_menu_suspenso_2,
                    "texto_menu_suspenso_2": texto_menu_suspenso_2,
                    "titulo_menu_suspenso_3": titulo_menu_suspenso_3,
                    "texto_menu_suspenso_3": texto_menu_suspenso_3,
                    "id_usuario": id_usuario,
                    "arquivo1": arquivo1, //file imagem
                    "arquivo2": arquivo2, //file imagem
                    "arquivo3": arquivo3 //file imagem
                }, // Valores que vou enviar para o PHP
                dataType: 'json', // Tipo de retorno do PHP
                success: function(result) { //Resultado retornado do PHP 'result'
                    if (result.deucerto) {
                        $("#loading").remove();
                    } else {
                        alert("Erradão");
                    }
                }
            });
        });
    });
});
php javascript ajax
  • 1

    You need the enctype property to be set to Multipart/form-data for your files to be sent in the request. https://answall.com/questions/9704/fazer-upload-de-arquivo-com-ajax

  • 1

    give a look here https://answall.com/questions/9704/fazer-upload-archivalcom-ajax/9712

  • thank you very much folks

1 answer

0

I ended up changing my code ajax and worked perfectly `

                            $("#formulario").submit(function() {
                                var formData = new FormData(this);

                                $.ajax({
                                    url: window.location.pathname,
                                    type: 'POST',
                                    data: formData,
                                    success: function(data) {
                                        alert(data)
                                    },
                                    cache: false,
                                    contentType: false,
                                    processData: false,
                                    xhr: function() { // Custom XMLHttpRequest
                                        var myXhr = $.ajaxSettings.xhr();
                                        if (myXhr.upload) { // Avalia se tem suporte a propriedade upload
                                            myXhr.upload.addEventListener('progress', function() {
                                                /* faz alguma coisa durante o progresso do upload */
                                            }, false);
                                        }
                                        return myXhr;
                                    }
                                });
                            });

`

Browser other questions tagged php javascript ajax

You are not signed in. Login or sign up in order to post.