0

Tenho o código abaixo, no qual obtenho uma consulta ajax para um arquivo .php. O problema é que dessa forma, só consigo retorno no final do processo, com o método success:, mas eu preciso informar ao usuário o andamento do processamento que ocorre no PHP. Como proceder? Tentei o método beforeSend: mas pelo que diz a documentação (e confirmei com um teste), é apenas um método para fazer algo imediatamente antes de enviar a solicitação, e nada mais. Eu preciso de algo para interagir entre o processamento ocorrido no servidor com a página em que foi disparado o ajax, ou seja, por exemplo: num while {...} que tá dentro do .php, preciso de uma forma para interagir com um contador interno que coloquei lá ($counter, por exemplo). Eis o código:

arquivo .js

$.ajax({
    type:'post',          
    dataType: 'json',
    url: 'genTableBible.php',
    beforeSend: function(dados){
       alert(dados);
    },                            
    success: function(dados){
        for(var i=0;dados.length>i;i++){
            $('#'+xbody).append('<tr class="mudacor"><td class="seleciona" ></td></tr>');
        }
    }
)}

Arquivo .php

<?php
    ini_set('memory_limit','-1');
    require_once('CLASSES/usuarios.php');
    $u = new Usuario;
    global $pdo;
    
    $u->conectar("host","mysql.servidor.com.br","user","senha");
    $xmsgErro = $u->msgErro;
    $sql = $pdo->prepare("SELECT * FROM table LIMIT 400");
    $sql->execute();
    $cont = 0;
    while ($result = $sql->fetch(PDO::FETCH_ASSOC))
    {
        $cont++;  // variável para se comunicar com a página/função de origem
        $dados[]=$result;
    }
    echo json_encode($dados);
?>
1

1 Resposta 1

0

Perante sua dúvida código abaixo deve te atender:

$(document).ready(function() {

    /* Configurações de cores da barra */
    var barColor = [
        {"MIN": 0,  "MAX": 30,  "BGCOLOR": "green",  "FONTCOLOR": "white" },
        {"MIN": 31, "MAX": 60,  "BGCOLOR": "yellow", "FONTCOLOR": "black" },
        {"MIN": 60, "MAX": 100, "BGCOLOR": "red",    "FONTCOLOR": "white" }
    ];

    /* Manipula as cores da barra */
    var defineColor = function(v, element) {
        var color = {};
        $.each(barColor, function(k, item){
            if(v >= item.MIN && v <= item.MAX)
                color = item;
        });
        element.style.color = color.FONTCOLOR;
        element.style.backgroundColor = color.BGCOLOR;
    }

    /* Atualizar valor da barra de progresso */
    var updateValue = function(data) {
        if(data){
            data = $.parseJSON(data);
            var bar = document.getElementById("sla-bar");
            var time = data.SLA;
            bar.style.width = time + "px";
            bar.innerHTML = time + "%";
            defineColor(time, bar);

            /* Quando atigir 100 para de rodar a função interval*/
            if(time >= 100)
                clearInterval(interval);
        }
    }

    /* Atualiza a barra de progresso de acordo com resultado PHP (sla.php)*/
    var updateBar = function() {
        $.ajax({
            url: 'sla.php',
            method: 'post',
            type: 'json',
            success: updateValue
        });
    }

    /* Chama a função updateBar() por um intervalo de 2 segundos */
    var interval = setInterval(function(){ updateBar(); }, 2000);
});

Referência: http://blog.rdtecnologia.com.br/php/barra-de-progresso-jquery-ajax-e-php/

8
  • Lucas Antonio... a resposta parece bem interessante, até porque tem link para demo, porém, não achei o arquivo php, nem HTML (a demonstração não forneceu todos os fontes). Assim, como é de difícil aplicação para mim no momento, pois adaptar as procedures no meu app para o seu exemplo é um pouco custoso (muda a lógica quase completamente), vou assinalar sua resposta como a melhor por ser funcional para o raciocínio do problema proposto. Vlw!
    – Fernandes
    Commented 12/08/2019 às 20:01
  • O arquivo php está na URL do ajax. Commented 12/08/2019 às 20:37
  • Ok, percebi melhor sim, todos os fontes! Lucas Antonio, pode me esclarecer essa linha no .html: $("#sla-bar").pb({ url: "sla.php"}); É que eu não entendi o método .pb(...) no Jquery (??) pesquisei na documentação Jquery...nada!
    – Fernandes
    Commented 12/08/2019 às 20:49
  • Onde tem esse .pb? Commented 12/08/2019 às 20:58
  • 1
    oi, desculpe a demora... o .pb está no arquivo fonte html, dentro da tag <script></script>
    – Fernandes
    Commented 12/08/2019 às 23:00

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .