Ir para conteúdo
Fórum Script Brasil
  • 0

Problemas ao ocultar dados


alexandremanowar

Pergunta

E ae pessoal beleza!

Fiz um programinha para estudar ajax e ele esta 80% funcionando bem, o problema que tenho é o seguintes tenho um combox que ao escolher um opção ele mostra uns dados na tela onde ao clicar em um desses dados ele ativa um <b> que esta com padrão style="display: none;" e exibe os dados que vem do meu banco, a minha idéa e que clicar no link ele oculte novamente o <b> mas simplesmente não esta funcionando, já fiz algo paracido com div e funcionou mas era mais simples esse esta um pouco mais complexo.

Outro problema é que quando eu escolho uma das opções que estão no combobox ele me exibe na <b> todas as opções uma abaixo da outra até então ok. Porém cada opção é um link que vai exibir informação ao ser clicado também esta funcionando o único problema é que ele exibe no fim da página ao invés de exibir abaixo da opção clicada! Ou seja ele deveria empurrar os outros links para baixo e exibir os dados do link que foi clicado e se eu clicar no link novamente ele oculta os dados deixando os demais links onde estavam!

Olha como esta meu código:

index:

<?php
//expirar página
  // Data no passado
//header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");

// Sempre modificado
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");

// HTTP/1.1
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);

// HTTP/1.0
header("Pragma: no-cache");


// fim


$usuario = $_COOKIE["usuario"];
$senha  = $_COOKIE["senha"];
$nivel = $_COOKIE["nivel"];
$logado = $_COOKIE["logado"];
$codigo_logado = $_COOKIE["codigo_logado"];
if(empty($usuario) || empty($senha))
{
 setcookie("usuario");
 setcookie("senha");
  echo "<center><class='titulo6'>acesso não permitido<BR>o software foi finalizado <BR>por motivos de segurança</a></center>";

}
else
{
    include "conectadeals.inc";
    include "ie.htm";
    $data = date("Y-m-d");
    echo "<LINK REL='STYLESHEET' HREF='estilo.css' TYPE='text/css'>";
    if($nivel == "Administrativo")
    {
        include "admtop.inc";
        include "colunaesquerda.inc";    
        include "colunacentral_home.inc";

        echo "<center>consulta finança</center>";
  
        ?>
            &lt;script language="javascript" src="js/VerificaBrownser.js"></script>
            &lt;script language="javascript" src="js/ajax_financa.js"></script>
            
            <form method="POST" action="frmAjax">
            
            centralizadora:<select name="centralizadora" id="centralizadora"  onChange="Dados(this.value);">
            <option id="opcoes" value="0">Escolha a centralizadora</option>
            <?
                $busca = mysql_query("select * from centralizadora order by nome");
                $linha = mysql_num_rows($busca);
                for($i=0; $i<$linha; $i++)
                {
                    $reg = mysql_fetch_row($busca);
                    ?>
                        <option value="<?=$reg[4]?>"><?echo $reg[0]; ?></option>
                    <?
                    
                    
                }
            ?>
            </select>
            <br>
            
            <b id="CentroCusto" style="display: none;"> </b>
            <b id="Conta" style="display: none;"> </b>
            
        </form>
        <?
    
        
        
        include "colunadireita.inc";



        include "base.inc";

    }




}
?>
</td>
</tr>
</table>
</div>
o código em js
function Dados(valor) 
{ 
if(ajax) 
{
    
    
     var selectCentralizadora = document.getElementById('centralizadora');
     var CentroCustoHTML = document.getElementById('CentroCusto');

     
    ajax.open("POST", "consulta_financa2.php", true);
    ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
         
    ajax.onreadystatechange = function() 
    {
     
        
        
        if(ajax.readyState == 4 ) 
        {
            if(ajax.responseXML) 
            {
                processXML(ajax.responseXML);
            }
            
        }
    }
         
         var params = "centralizadora="+valor;
         ajax.send(params);
}
}      
function processXML(obj)
{ 
  
    var dataArray   = obj.getElementsByTagName("CentroCustos");
    var CentroCustoHTML = document.getElementById('CentroCusto');
    var CentroCustoDescricao  = "";
    
    if (document.getElementById('CentroCusto').style.display == "none") 
    {
           document.getElementById('CentroCusto').style.display= "";
        
    }
    else
    {
        document.getElementById('CentroCusto').style.display == "none"
        
    }
      
    if(dataArray.length > 0) 
    {
         
         for(var i = 0; i < dataArray.length; i++) 
         {
            var item = dataArray[i];
            //contéudo dos campos no arquivo XML
            
            var span = document.createElement("span");
            
            CentroCustoDescricao  = CentroCustoDescricao + '<b id="' + item.getElementsByTagName("codigoCentro")[0].firstChild.nodeValue +'"><span id="' + item.getElementsByTagName("codigoCentro")[0].firstChild.nodeValue +'">[+]</span><a href="#" onclick="loadContas('+ item.getElementsByTagName("codigoCentro")[0].firstChild.nodeValue + "," + item.getElementsByTagName("codigoCentralizadora")[0].firstChild.nodeValue +')">' + item.getElementsByTagName("centro")[0].firstChild.nodeValue + '</a></b>' +'<br>';
                
            CentroCustoHTML.innerHTML =  CentroCustoDescricao;
    
        
         }
      }
      else 
      {
        //caso o XML volte vazio, printa a mensagem abaixo
        alert("Escolha uma centralizadora");
      }      
 }

 function loadContas(codigoCentro,codigoCentralizadora)
 {
    
    if(ajax) 
    {
        //captura  o local onde serão exibidos os dados na tela
        var ContasHTML = document.getElementById('Conta');

     
    ajax.open("POST", "consulta_conta.php", true);
    ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
         
    ajax.onreadystatechange = function() 
    {
     
                
        if(ajax.readyState == 4 ) 
        {
            if(ajax.responseXML) 
            {
                ContasXML(ajax.responseXML,codigoCentro,codigoCentralizadora);
            }
            
        }
    }
         
        var params = "codigoCentro="+codigoCentro+"&codigoCentralizadora="+codigoCentralizadora;
        ajax.send(params);
         
        
    }
 }

 function ContasXML(obj,codigoCentro,codigoCentralizadora)
{
     
    var dataArray   = obj.getElementsByTagName("Contas");
    var ContasHTML = document.getElementById('Conta');
    var ContaDescricao = "";
    var CentroCustoDescricao  = "";
    if (document.getElementById('Conta').style.display == "none") 
    {
           document.getElementById('Conta').style.display= "";
              
    }  
      
    if(dataArray.length > 0) 
    {
         
         for(var i = 0; i < dataArray.length; i++) 
         {
            var item = dataArray[i];
            ContaDescricao  = ContaDescricao  + item.getElementsByTagName("descricao")[0].firstChild.nodeValue + "<br>" 
        
            ContasHTML.innerHTML = ContaDescricao;
    
         }
      }
      else 
      {
        //caso o XML volte vazio, printa a mensagem abaixo
        alert("Escolha uma centro de custos");
      }      
 }
os códigos em php
<?
include "conectadeals.inc";         

            
$centralizadora = $_POST["centralizadora"]; 

$busca = mysql_query("select * from financa where codigo_centralizadora=$centralizadora order by cont ");
$linha = mysql_num_rows($busca);
if($linha>0) 
{                
   $xml  = "<?xml version=\"1.0\" encoding=\"ISO-8859-1\"?>\n";
   $xml .= "<centralizadora>\n";               
   for($i=0; $i<$linha; $i++) 
   { 
      $reg = mysql_fetch_row($busca);
      $xml .= "<CentroCustos>\n";     
      if($reg[3]!=$repete)
      {
        $xml .= "<centro>".$reg[4]."</centro>\n";
        $xml .= "<codigoCentro>".$reg[3]."</codigoCentro>\n";
        $xml .= "<codigoCentralizadora>".$reg[5]."</codigoCentralizadora>\n";
      }
               
      $xml .= "</CentroCustos>\n";          
      
      $repete = $reg[3];
               
   }               
    $xml.= "</centralizadora>\n";
   
   
   //CABE?ALHO
   Header("Content-type: application/xml; charset=iso-8859-1"); 
}                                               

//PRINTA O RESULTADO  
echo $xml;             

?>
<?
include "conectadeals.inc";         

            
$codigoCentro = $_POST["codigoCentro"];

$codigoCentralizadora = $_POST["codigoCentralizadora"];


$busca = mysql_query("select * from financa where codigo_centralizadora=$codigoCentralizadora and codigo_centro_custo=$codigoCentro order by cont ");
$linha = mysql_num_rows($busca);
if($linha>0) 
{                
   $xmlConta  = "<?xml version=\"1.0\" encoding=\"ISO-8859-1\"?>\n";
   $xmlConta .= "<centralizadora>\n";               
   for($i=0; $i<$linha; $i++) 
   { 
      $reg = mysql_fetch_row($busca);
      $xmlConta .= "<Contas>\n";     
      if($reg[18]!=$repete)
      {
        $xmlConta .= "<codigo>".$reg[18]."</codigo>\n";
        $xmlConta .= "<descricao>".$reg[19]."</descricao>\n";

      }
               
      $xmlConta .= "</Contas>\n";          
      
      $repete = $reg[18];
               
   }               
    $xmlConta.= "</centralizadora>\n";
   
   
   //CABE?ALHO
   Header("Content-type: application/xml; charset=iso-8859-1"); 
}                                               

//PRINTA O RESULTADO  
echo $xmlConta;             

?>

Onde estou errando? E se alguém tiver uma dica de como melhorar esse código eu agradeço.

Valeu

Editado por alexandremanowar
Link para o comentário
Compartilhar em outros sites

4 respostass a esta questão

Posts Recomendados

  • 0

Alexandre, não tem como especificar a parte do código de onde está o problema?

Ficaria sem dúvida mais fácil de ajudar. Não dá pra eu ficar fazendo o teste de mesa nesse código enorme tendo em vista a simplicidade do efeito que deseja executar.

Link para o comentário
Compartilhar em outros sites

  • 0

E ae beleza

Então cara valeu pela atenção, o problema esta nas duas funções abaixo, ao clicar em um dos links que é gerado pela função processXML ele ativa a função abaixo a idéia da função abaixo que deveria exibir os resultados abaixo do link clicado e se clicar no link novamente ele deveria ocultar os dados mas isso não esta acontecendo! Quando eu clico em um dos links ele mostra o resultado no fim da tela e se clico novamente ele simplesmente não faz nada!

A função é essa:

function loadContas(codigoCentro,codigoCentralizadora)
{
    
    if(ajax)
    {
        //captura  o local onde serão exibidos os dados na tela
        var ContasHTML = document.getElementById('Conta');

    
    ajax.open("POST", "consulta_conta.php", true);
    ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        
    ajax.onreadystatechange = function()
    {
    
                
        if(ajax.readyState == 4 )
        {
            if(ajax.responseXML)
            {
                ContasXML(ajax.responseXML,codigoCentro,codigoCentralizadora);
            }
            
        }
    }
        
        var params = "codigoCentro="+codigoCentro+"&codigoCentralizadora="+codigoCentralizadora;
        ajax.send(params);
        
        
    }
}

function ContasXML(obj,codigoCentro,codigoCentralizadora)
{
    
    var dataArray   = obj.getElementsByTagName("Contas");
    var ContasHTML = document.getElementById('Conta');
    var ContaDescricao = "";
    var CentroCustoDescricao  = "";
    if (document.getElementById('Conta').style.display == "none")
    {
           document.getElementById('Conta').style.display= "";
              
    }  
      
    if(dataArray.length > 0)
    {
        
         for(var i = 0; i < dataArray.length; i++)
         {
            var item = dataArray[i];
            ContaDescricao  = ContaDescricao  + item.getElementsByTagName("descricao")[0].firstChild.nodeValue + "<br>"
        
            ContasHTML.innerHTML = ContaDescricao;
    
         }
      }
      else
      {
        //caso o XML volte vazio, printa a mensagem abaixo
        alert("Escolha uma centro de custos");
      }      
}

Valeu mais uma vez pela atenção! Preciso mesmo de ajuda para resolver isso meu prazo esta acabando

Link para o comentário
Compartilhar em outros sites

  • 0

Alexandre, como você diz que o problema está em ocultar e mostrar, imagino que o problema esteja aqui:

if (document.getElementById('Conta').style.display == "none")
    {
           document.getElementById('Conta').style.display= "";
              
    }
Esse trecho verifica se o elemento está sendo mostrado, e em caso de não estar, ele.....ele não faz nada. Aqui seria algo do tipo:
switch(ContasHTML.style.display){
                      case "": ContasHTML.style.display="block"; break
                      case "none": ContasHTML.style.display="block"; break
                      case "block": ContasHTML.style.display="none"; break
                     }

Era isso? Se o div estiver aparecendo ele oculta, se ele não estiver aparecendo ele mostra.

Lembrando que o javascript não consegue ler as informações do Css declaradas anteriormente numa folha externa, ou nas tags <style></style>. É necessário usar outro código pra pegar o valor, que não vem ao caso agora. Tratei essa parte pelo case que dá uma string vazia.

Aquele abraço.

Link para o comentário
Compartilhar em outros sites

  • 0

E ae beleza!

Cara era exatamente esse o problema pensei que usado if else funcionava, valeu mesmo pela atenção cara e esse exemplo serve para um monte de outras coisa! Muito obrigado mesmo

At+

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...