[RESOLVIDO] Ajax sinc. e assinc, com imagem de carregando

[Waksman]

Galera, seguinte. Estava tentando fazer aparecer uma imagem em quanto a requisição estiver rodando.

OK.

Pesquisando verifiquei que é so colocar FALSE na requisição que ela passa a ser sinc. e ira aguardar.

OK.

Se eu utilizo a função em FALSE, aparece a imagem de carregando, mas assim que a operação é concluida, o texto do ajax não aparece no local.

Se eu utilizo a função com TRUE, a imagem não aparece mais, acredito que seja por que não existe mais a espera pelo processamento e ao final do codigo a imagem é oculta instantaneamente, porem o texto ajax aparece corretamente no local.

Se fosse um erro no codigo ajax, acredito que não funcionaria de nenhum dos dois jeitos, mas eu não entendo por que quando coloco em FALSE ele para de aparecer na pagina.

Quando digo FALSE e TRUE me refiro a linha 22 do codigo abaixo. Navegador Mozilla

var idImagemCarregando;
var comboPing;
//Mostrar imagem gif (carregando)
function trocarVisibilidade(id){
    idImagemCarregando = 'carregando' + id;
    var div1 = document.getElementById(idImagemCarregando);
    div1.style.display = 'block';
    var div2 = document.getElementById('ping' + id);
    div2.style.display = 'none';
}
function mandaPingAjax(combo, ip){
    url="/jsp/rede/roteador/ping.jsp?ip="+ip;
    comboPing = combo;
    ajaxPing(url);
}
function ajaxPing(url){
    req = null;
    // Procura por um objeto nativo (Mozilla/Safari)
    if (window.XMLHttpRequest) {
        req = new XMLHttpRequest();
        req.onreadystatechange = processReqChangePing;
        req.open("GET",url,true);
        req.send(null);
        var div1 = document.getElementById(idImagemCarregando);
        div1.style.display = 'none';
        var div2 = document.getElementById(comboPing);
        div2.style.display = 'block';
    // Procura por uma versão ActiveX (IE)
    } else if (window.ActiveXObject) {
        req = new ActiveXObject("Microsoft.XMLHTTP");
        if (req) {
            req.onreadystatechange = processReqChangePing;
            req.open("GET",url,false);
            req.send();
        }
    }
}
function processReqChangePing(){
    //alert('teste');
    // apenas quando o estado for "completado"
    if (req.readyState == 4) {
        // apenas se o servidor retornar "OK"
        if (req.status ==200) {
            // procura pela div id="pagina" e insere o conteudo
            // retornado nela, como texto HTML
            document.getElementById(comboPing).innerHTML = req.responseText;
        } else {
            document.getElementById(comboPing).innerHTML = req.statusText;
        }
    }
}

eu chamo este codigo desta maneira:

onClick="trocarVisibilidade('<%= cont%>'), mandaPingAjax('ping<%= cont%>', '<%= IP%>')"

Pra testar, eu coloquei um alert('teste') na linha 39, em TRUE o alert é exibido na tela, em FALSE ele não é exibido

Editado Março 24, 2011 por Waksman

[Waksman]

nem idéia? :(

[Waksman]

Resolvi com JQuery

//Função para JQuery
<script>
    function pingaRoteador(id, ip) {
        $('#ping'+id).html('<img src="/imagens/carregando.gif" width="230" height="15" />');
        $('#ping'+id).load("/jsp/rede/roteador/ping.jsp?ip="+ip);
    }
</script>

//Div onde é mostrado o resultado
<div id="ping<%=++cont%>"></div>

//Chamada no Codigo
onClick="pingaRoteador(<%= cont%>, '<%= getIp()%>')"

Editado Março 24, 2011 por Waksman