none
Ocultar DIV com javascript. RRS feed

  • Pergunta

  • Senhores, boa tarde!

    Necessito muito da opinião de vocês que têm mais experiência que eu.

    Preciso apresentar em um webform o status de alguns equipamentos controlados remotamente via IP.

    Criei uma tabela no código sem linhas e colunas.  Crio as células dinamicamente conforme a quantidade de equipamentos, com o limite de 5 colunas por linha.  Sendo assim, se tiverem 7 equipamentos, teremos 5 colunas na primeira linhas e 3 na segunda apresentando o nº do IP e um imagebutton com a imagem de Ativo ou Inativo.

    Fiz tudo conforme abaixo:

    protected void Cria_Celulas(ArrayList nTrm)
        {
            int rowCnt;
            int rowCtr;
            int cellCtr;
            int cellCnt;
    
            int x = 1; //Index dos controles
            int y = 0; //Index dos registros por coluna
            Table1.CellPadding = 5;
            Table1.CellSpacing = 5;
    
    
            int nCell = 5;
            double ntotal = (double)nTrm.Count / (double)nCell; // nTrm.Count / nCell;
            int total = (int)Math.Ceiling(ntotal);
            int loopCell = 0;
            
            rowCnt =  total; // Linhas(nTrm.Count); // Indica o número de linhas 
            cellCnt = nCell; // Número de colunas  sempre em 5  
    
            for (rowCtr = 1; rowCtr <= rowCnt; rowCtr++)
            {
                TableRow tRow = new TableRow();
                Table1.Rows.Add(tRow);
                y = 1;
                for (cellCtr = 1; cellCtr <= cellCnt; cellCtr++)
                {
                    //Temq ser menor q a quantidade de registros
                    if (x <= nTrm.Count)
                    {
                        
                        for (int i = loopCell; i < nTrm.Count; i++)
                        {
    
                            if (y <= nCell)
                            {
                                TableCell tCell = new TableCell();
                                tCell.Width = 150;
                                tRow.Cells.Add(tCell);
                                string prodID = rowCtr + "_" + cellCtr;
    
                                IList Registro = (IList)nTrm[loopCell];
    
                                tCell.Controls.Add(new LiteralControl(Registro[7].ToString()));
                                tCell.Controls.Add(new LiteralControl("<BR />"));
                                tCell.Controls.Add(new LiteralControl("IP: " + Registro[0].ToString()));
                                tCell.Controls.Add(new LiteralControl("<BR />"));
                                ImageButton img = new ImageButton();
                                img.ID = "img" + Registro[0].ToString();
                                img.OnClientClick = "Detalhes()";
                                img.ImageUrl = "~/Imagens/Status-user-busy-icon64.png";
                                tCell.Controls.Add(img);
    
                                loopCell = loopCell + 1;
                                y = y + 1;
                                x = x + 1;
                            }
                        }
                    }
                    
                }
            }
        }

    Até aqui tudo ok.

    Meu problema começa quando preciso capturar o click do imagebutton.

    Capturando OnClientClick eu consigo via JavaScript pegar o clique, mas não consigo ocultar a div que guarda minha tabela e mostrar a div que retornará com os detalhes do equipamento, onde o operador irá tomar a decisão conforme as instruções vindas do equipamento (via tcp/ip). Após ação tomada, terei que ocultar a div detalhes e mostrar novamente a div com a tabela.

    Bom, conforme o código abaixo eu consigo abrir uma nova janela, mas não consigo ocultar/mostrar as div:

    <script type="text/javascript"> function Detalhes() { javascript: window.open("http://www.apenasteste.com.br");

    document.all('Imgs').style.display = "none"; document.all('Detalhes').style.display = "inline"; } </script>


    O que estou fazendo de errado? 

    Outro problema, quando clico no imagebutton, as células dinâmicas somem.  O que fiz de errado?

    Desde já agradeço a ajuda,


    Perrot


    • Editado Perrot terça-feira, 31 de julho de 2012 19:52 Título erado.
    terça-feira, 31 de julho de 2012 19:40

Respostas

  • Perrot,

    Tente estas duas alterações:

    <script type="text/javascript">
            function Detalhes() {
                window.open("http://www.solun.com.br");
                document.getElementById('tabela-container').style.display = "none";
                document.getElementById('detalhe-container').style.display = "inline"; 
            }    
        </script>
    <div id="tabela-container">
            <asp:UpdatePanel ID="UpdatePanel2" runat="server" >
                  <ContentTemplate>
                        <div ID="divTabela" runat="server">
                            
                            <asp:panel ID="Panel1" runat="server" CssClass="TblCenter" >  
                                <asp:Table ID="Table1" runat="server" >
                                    
                                </asp:Table>
                            </asp:panel>
                        </div>
                    </ContentTemplate>   
            </asp:UpdatePanel>
        </div>
        <div id="detalhe-container" style="display:none;">
            <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                <ContentTemplate>
                    <div ID="divDetalhes" runat="server" style="display: none">
                        <asp:panel ID="Panel2" runat="server" CssClass="TblCenter" >  
                            <asp:Button ID="Button1" runat="server" Text="Liberar" 
                                onclick="Button1_Click" />
                        </asp:panel>
                    </div>
                </ContentTemplate>   
            </asp:UpdatePanel>
        </div>
    • Marcado como Resposta Perrot quarta-feira, 1 de agosto de 2012 22:38
    quarta-feira, 1 de agosto de 2012 21:04

Todas as Respostas

  • O ASP.NET diria para você em resposta a sua questão: "O problema não é você, sou eu..."

    O ASP.NET, por padrão, altera as IDs de todos os elementos quando renderiza a página. Então quando você utiliza uma função JavaScript que dá um GET nos elementos por ID, você nunca vai conseguir pegá-los. Faça o teste. Abra seu site, olhe o código fonte e procure os campos que você criou. Veja como estão suas IDs.

    Existe um modo de resolver isso. Existe uma propriedade em cada elemento chamado ClientModeID. Por padrão, esta propriedade é configurada como Auto ou Inherit. Modifique-a para Static e suas IDs não mudarão mais, sendo possível recuperar os campos via JavaScript.

    Eu nao gosto muito disso... prefiro fazer todo tipo de manipulação pelo CodeBehind. Mas gosto é gosto...


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    terça-feira, 31 de julho de 2012 19:57
  • O ASP.NET diria para você em resposta a sua questão: "O problema não é você, sou eu..."

    O ASP.NET, por padrão, altera as IDs de todos os elementos quando renderiza a página. Então quando você utiliza uma função JavaScript que dá um GET nos elementos por ID, você nunca vai conseguir pegá-los. Faça o teste. Abra seu site, olhe o código fonte e procure os campos que você criou. Veja como estão suas IDs.

    Existe um modo de resolver isso. Existe uma propriedade em cada elemento chamado ClientModeID. Por padrão, esta propriedade é configurada como Auto ou Inherit. Modifique-a para Static e suas IDs não mudarão mais, sendo possível recuperar os campos via JavaScript.

    Eu nao gosto muito disso... prefiro fazer todo tipo de manipulação pelo CodeBehind. Mas gosto é gosto...


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    Rafael, obrigado pela ajuda.

    Eu até tentei fazer pelo CodeBehind, mas não consigo capturar o OnClientClick.  Você sabe como?  Se eu conseguir será melhor que usar o javascript.

    Novamente agradeço,


    Perrot

    terça-feira, 31 de julho de 2012 20:13
  • Bem, eu ACHO que sei sim.

    As suas imagens e divs estão com runnat="server"???


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    terça-feira, 31 de julho de 2012 20:15
  • Bem, eu ACHO que sei sim.

    As suas imagens e divs estão com runnat="server"???


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    As divs sim, mas o imagebutton eu crio dinamicamente e não tem essa opção, pelo menos não vi.  Tem como colocar também?

    Perrot

    terça-feira, 31 de julho de 2012 20:28
  • Se você cria dinamicamente então isto está implícito, não precisa. Apenas defina IDs para esses controles. Quanto as DIVs, nesse caso têm que ter.

    Então você pode usar a propriedade Visible no CodeBehind para mostrar ou esconder sua div e controles. Resta agora chamar o window.open.

    Use o seguinte para executar um JavaScript através do CodeBehind: 

    No método que você colocar seus códigos de visible true/false
    ClientScriptManager cm = Page.ClientScript;
    cm.RegisterClientScriptBlock(this.GetType(),"PopUp", "window.open('http://www.apenasteste.com.br');", true);

    Mais informações veja em: http://msdn.microsoft.com/en-us/library/ms178207.aspx


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto


    • Editado Rafa Santos terça-feira, 31 de julho de 2012 21:01
    terça-feira, 31 de julho de 2012 21:00
  • Se você cria dinamicamente então isto está implícito, não precisa. Apenas defina IDs para esses controles. Quanto as DIVs, nesse caso têm que ter.

    Então você pode usar a propriedade Visible no CodeBehind para mostrar ou esconder sua div e controles. Resta agora chamar o window.open.

    Use o seguinte para executar um JavaScript através do CodeBehind: 

    No método que você colocar seus códigos de visible true/false
    ClientScriptManager cm = Page.ClientScript;
    cm.RegisterClientScriptBlock(this.GetType(),"PopUp", "window.open('http://www.apenasteste.com.br');", true);

    Mais informações veja em: http://msdn.microsoft.com/en-us/library/ms178207.aspx


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto


    Rafa,

    Na verdade eu não consigo acessar o código criado no codebehind, pois não consigo capturar o Onclick, somente o OnClientClick.  Com isso não consigo usar o visible no codeBehind. Eu tb não preciso abrir outra página.  Só coloquei para saber se eu consegui acessar a função javascript.

    Quanto ao div, não tem a propriedade ClientModeID.

    Se eu conseguir capturar o click pelo codebehind meu problema acaba.

    Obrigado,


    Perrot

    terça-feira, 31 de julho de 2012 21:07
  • Perrot,

    Eu tenho até como simular isso sim... Mas acho que até pela simulação você irá perder as células dinâmicas. Porque você as perde justamente pelo fato de a tela sofrer um postback e você não chamar novamente o método Cria_celulas().

    Tente chamar esse método dentro do OnClick() e me diga se vai funcionar. Vamos, por hora, deixar de lado o OnClientClick.


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    terça-feira, 31 de julho de 2012 21:13
  • Perrot,

    Eu tenho até como simular isso sim... Mas acho que até pela simulação você irá perder as células dinâmicas. Porque você as perde justamente pelo fato de a tela sofrer um postback e você não chamar novamente o método Cria_celulas().

    Tente chamar esse método dentro do OnClick() e me diga se vai funcionar. Vamos, por hora, deixar de lado o OnClientClick.


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    Não estou conseguindo chamar o OnClick().  Só me dá a opção do OnClientClick.  Deve ser pq ele cria o imagebutton somente do lado do cliente.  Será q é isso?  Tem com você colocar um exemplo?

    Obrigado.


    Perrot

    terça-feira, 31 de julho de 2012 21:22
  • Ahhhhhhhhh... hehe então é isso. Eu acho que você está olhando a tabela de propriedades mas não está vendo os eventos. Eu não sei o quanto vc sabe de Visual Studio, então não se sinta um idiota com o q vou falar. Na sua tabela de propriedades, no modo de design, veja que tem um raio amarelo, quase q no topo da janela de propriedades (com o botão marcado). Ele te dá a relação de eventos daquele controle.

    Configure seu ImageButton assim (claro, mudando seu ID):

    <asp:ImageButton ID="ImageButton1" runat="server" 
            onclick="ImageButton1_Click" />

    e no CodeBehind assim:

    protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
            {

            }


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    terça-feira, 31 de julho de 2012 21:29
  • Ahhhhhhhhh... hehe então é isso. Eu acho que você está olhando a tabela de propriedades mas não está vendo os eventos. Eu não sei o quanto vc sabe de Visual Studio, então não se sinta um idiota com o q vou falar. Na sua tabela de propriedades, no modo de design, veja que tem um raio amarelo, quase q no topo da janela de propriedades (com o botão marcado). Ele te dá a relação de eventos daquele controle.

    Configure seu ImageButton assim (claro, mudando seu ID):

    <asp:ImageButton ID="ImageButton1" runat="server" 
            onclick="ImageButton1_Click" />

    e no CodeBehind assim:

    protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
            {

            }


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    Rafa,

    eu crio o imagebutton dinamicamente, assim:

    ImageButton img = new ImageButton();
    img.ID = "img" + Registro[0].ToString();
    img.OnClientClick = "Detalhes()";
    img.ImageUrl = "~/Imagens/Status-user-busy-icon64.png";

    Não tenho a opção do "OnClick".

    Até tentei assim:

    img.Attributes.Add("OnClick", "Detalhes()");

    Mas não consegui.

    Tem como criar o OnClick criando o imagebutton dinamicamente?


    Perrot

    terça-feira, 31 de julho de 2012 21:39
  • Perrot, é que para chamar um evento dinamicamente, o buraco é mais embaixo (usa-se essa gíria hj em dia?!) eheh

    Assim vai funcionar:

    ImageButton img = new ImageButton();
    img.ID = "img" + Registro[0].ToString();                
    img.Click += new ImageClickEventHandler(img_Click);
    img.ImageUrl = "~/Imagens/Status-user-busy-icon64.png";

    Aqui está o macete: 

    img.Click += new ImageClickEventHandler(img_Click);

    Onde img_Click tem que ser o nome do seu método. Então, basta colocar esse método no seu CodeBehind:

    protected void img_Click(object sender, ImageClickEventArgs e)
    {
    
    }

    AGORA VAI \o/


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    terça-feira, 31 de julho de 2012 21:47
  • Boa noite Perrot,

    Tenta modificar seu script desta forma:

    <script type="text/javascript"> 
    function Detalhes() { 
    document.getElementById('<%= divTabela.ClientID %>').style.display = "none";
    document.getElementById('<%= divDetalhes.ClientID %>').style.display = "inline"; 
    }
    </script>
    Este código assume que:
    -sua tabela esta dentro de um elemento div com runat = server e o id = divTabela;
    -os detalhes estao dentro de uma div com runat = server e o id = divDetalhes.

    Matenha esta linha na criação do seu botão:
    img.OnClientClick = "Detalhes()";
    Att,

    quarta-feira, 1 de agosto de 2012 02:43
  • Perrot, é que para chamar um evento dinamicamente, o buraco é mais embaixo (usa-se essa gíria hj em dia?!) eheh

    Assim vai funcionar:

    ImageButton img = new ImageButton();
    img.ID = "img" + Registro[0].ToString();                
    img.Click += new ImageClickEventHandler(img_Click);
    img.ImageUrl = "~/Imagens/Status-user-busy-icon64.png";

    Aqui está o macete: 

    img.Click += new ImageClickEventHandler(img_Click);

    Onde img_Click tem que ser o nome do seu método. Então, basta colocar esse método no seu CodeBehind:

    protected void img_Click(object sender, ImageClickEventArgs e)
    {
    
    }

    AGORA VAI \o/


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    Rafael,

    não deu certo.


    Perrot

    quarta-feira, 1 de agosto de 2012 14:23
  • Boa noite Perrot,

    Tenta modificar seu script desta forma:

    <script type="text/javascript"> 
    function Detalhes() { 
    document.getElementById('<%= divTabela.ClientID %>').style.display = "none";
    document.getElementById('<%= divDetalhes.ClientID %>').style.display = "inline"; 
    }
    </script>
    Este código assume que:
    -sua tabela esta dentro de um elemento div com runat = server e o id = divTabela;
    -os detalhes estao dentro de uma div com runat = server e o id = divDetalhes.

    Matenha esta linha na criação do seu botão:
    img.OnClientClick = "Detalhes()";
    Att,

    Vitor,

    obrigado pela ajuda, mas não deu certo.

    Abre o link, mas não mostra a divDetalhes.


    Perrot

    quarta-feira, 1 de agosto de 2012 14:23
  • Boa tarde Perrot,

    Você poderia postar o seu código? O HTML também.
    O código chego a ocultar a tabela pelo menos?
    Só falho na hora de exibir os detalhes?

    Att,
    quarta-feira, 1 de agosto de 2012 16:50
  • Utilize o atributo ID da div tanto para ocultar, quanto para exibir a mesma.

    Atenciosamente, Marcio Nogueira Cardoso Pinto.

    quarta-feira, 1 de agosto de 2012 19:50
  • Boa tarde Perrot,

    Você poderia postar o seu código? O HTML também.
    O código chego a ocultar a tabela pelo menos?
    Só falho na hora de exibir os detalhes?

    Att,

    Boa tarde, Vitor.

    Segue abaixo o código:

    protected void Cria_Celulas(ArrayList nTrm)
        {
            int rowCnt;
            int rowCtr;
            int cellCtr;
            int cellCnt;
    
            int x = 1; //Index dos controles
            int y = 0; //Index dos registros por coluna
            Table1.CellPadding = 5;
            Table1.CellSpacing = 5;
    
    
            int nCell = 5;
            double ntotal = (double)nTrm.Count / (double)nCell; 
            int total = (int)Math.Ceiling(ntotal);
            int loopCell = 0;
            
            rowCnt =  total; // Linhas(nTrm.Count); 
            cellCnt = nCell; // Número de colunas  sempre em 5
    
            for (rowCtr = 1; rowCtr <= rowCnt; rowCtr++)
            {
                // Create a new row and add it to the table.
                TableRow tRow = new TableRow();
                Table1.Rows.Add(tRow);
                y = 1;
                for (cellCtr = 1; cellCtr <= cellCnt; cellCtr++)
                {
                    //Temq ser menor q a quantidade de registros
                    if (x <= nTrm.Count)
                    {
                        
                        for (int i = loopCell; i < nTrm.Count; i++)
                        {
    
                            if (y <= nCell)
                            {
                                
                                TableCell tCell = new TableCell();
                                tCell.Width = 150;
                                tRow.Cells.Add(tCell);
                                
                                string prodID = rowCtr + "_" + cellCtr;
    
                                
                                IList Registro = (IList)nTrm[loopCell];
    
                                tCell.Controls.Add(new LiteralControl(Registro[7].ToString()));
                                tCell.Controls.Add(new LiteralControl("<BR />"));
                                tCell.Controls.Add(new LiteralControl("IP: " + Registro[0].ToString()));
                                tCell.Controls.Add(new LiteralControl("<BR />"));
                                ImageButton img = new ImageButton();
                                img.ID = "img" + Registro[0].ToString();
                                img.Attributes.Add("OnClick", "Libera");
                                img.Click += new ImageClickEventHandler(img_Click);
                                img.OnClientClick = "Detalhes()";
                                img.ImageUrl = "~/Imagens/Status-user-busy-icon64.png";
                                
                                
                                tCell.Controls.Add(img);
    
                                loopCell = loopCell + 1;
                                y = y + 1;
                                x = x + 1;
                            }
                        }
                    }
                    
                }
            }
        }

    <script type="text/javascript">
            function Detalhes() {
                
                javascript: window.open("http://www.solun.com.br");
                document.getElementById('<%= divTabela.ClientID %>').style.display = "none";
                document.getElementById('<%= divDetalhes.ClientID %>').style.display = "inline"; 
            }    
        </script>

    <div>
            <asp:UpdatePanel ID="UpdatePanel2" runat="server" >
                  <ContentTemplate>
                        <div ID="divTabela" runat="server">
                            
                            <asp:panel ID="Panel1" runat="server" CssClass="TblCenter" >  
                                <asp:Table ID="Table1" runat="server" >
                                    
                                </asp:Table>
                            </asp:panel>
                        </div>
                    </ContentTemplate>   
            </asp:UpdatePanel>
        </div>
        <div>
            <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                <ContentTemplate>
                    <div ID="divDetalhes" runat="server" style="display: none">
                        <asp:panel ID="Panel2" runat="server" CssClass="TblCenter" >  
                            <asp:Button ID="Button1" runat="server" Text="Liberar" 
                                onclick="Button1_Click" />
                        </asp:panel>
                    </div>
                </ContentTemplate>   
            </asp:UpdatePanel>
        </div>


    Perrot

    quarta-feira, 1 de agosto de 2012 20:45
  • Perrot, assim o que eu disse não tem como funcionar.

    Cadê o método img_Click que eu falei que tinha que criar?

    Esse é o método que será chamado no CodeBehind quando vc clicar no botão.

    Vc tem que colocar esse método aqui no seu código:

    protected void img_Click(object sender, ImageClickEventArgs e)
    {
    
    }

    Ele será disparado através do img.Click += new ImageClickEventHandler(img_Click);


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    quarta-feira, 1 de agosto de 2012 20:48
  • Perrot,

    Tente estas duas alterações:

    <script type="text/javascript">
            function Detalhes() {
                window.open("http://www.solun.com.br");
                document.getElementById('tabela-container').style.display = "none";
                document.getElementById('detalhe-container').style.display = "inline"; 
            }    
        </script>
    <div id="tabela-container">
            <asp:UpdatePanel ID="UpdatePanel2" runat="server" >
                  <ContentTemplate>
                        <div ID="divTabela" runat="server">
                            
                            <asp:panel ID="Panel1" runat="server" CssClass="TblCenter" >  
                                <asp:Table ID="Table1" runat="server" >
                                    
                                </asp:Table>
                            </asp:panel>
                        </div>
                    </ContentTemplate>   
            </asp:UpdatePanel>
        </div>
        <div id="detalhe-container" style="display:none;">
            <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                <ContentTemplate>
                    <div ID="divDetalhes" runat="server" style="display: none">
                        <asp:panel ID="Panel2" runat="server" CssClass="TblCenter" >  
                            <asp:Button ID="Button1" runat="server" Text="Liberar" 
                                onclick="Button1_Click" />
                        </asp:panel>
                    </div>
                </ContentTemplate>   
            </asp:UpdatePanel>
        </div>
    • Marcado como Resposta Perrot quarta-feira, 1 de agosto de 2012 22:38
    quarta-feira, 1 de agosto de 2012 21:04
  • Perrot, assim o que eu disse não tem como funcionar.

    Cadê o método img_Click que eu falei que tinha que criar?

    Esse é o método que será chamado no CodeBehind quando vc clicar no botão.

    Vc tem que colocar esse método aqui no seu código:

    protected void img_Click(object sender, ImageClickEventArgs e)
    {
    
    }

    Ele será disparado através do img.Click += new ImageClickEventHandler(img_Click);


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    Oi Rafael,

    Eu criei. Mas não funcionou:

    protected void img_Click(object sender, ImageClickEventArgs e)
        {
            Libera();
        }


    Perrot

    quarta-feira, 1 de agosto de 2012 21:04
  • Perrot, já inseriu um ponto de depuração no método pra ver se ele está sendo invocado, pelo menos?

    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    quarta-feira, 1 de agosto de 2012 21:11
  • Perrot, já inseriu um ponto de depuração no método pra ver se ele está sendo invocado, pelo menos?

    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    Sim.  O Método não executa.

    Perrot

    quarta-feira, 1 de agosto de 2012 21:12
  • Você tentou a alteração que eu sugeri? Não funcionou?
    quarta-feira, 1 de agosto de 2012 21:14
  • kct, não é possível! 

    Perrot, se Libera() é uma função em JavaScript, você não conseguirá executa-la desta forma no CodeBehind.

    Tente trocar seu ImageButton por um LinkButton a efeito de testes. Vê se ele realiza a chamada ao evento.


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    quarta-feira, 1 de agosto de 2012 21:15
  • kct, não é possível! 

    Perrot, se Libera() é uma função em JavaScript, você não conseguirá executa-la desta forma no CodeBehind.

    Tente trocar seu ImageButton por um LinkButton a efeito de testes. Vê se ele realiza a chamada ao evento.


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    Oi Rafael,

    Libera() não é no javascript.

    Nele tem apenas para visualizar e ocultar o Panel1 e 2, que no caso do javascript não uso o panel uso a div.  só isso.


    Perrot

    quarta-feira, 1 de agosto de 2012 21:22
  • Então tenho duas ponderações a fazer:

    1 - Você não postou o código todo;

    2 - isso não vai funcionar: img.Attributes.Add("OnClick", "Libera");

    A proposito, eu acho que é isso que está te prejudicando. Muito provavelmente isto está sobrescrevendo o evento OnClick. Retire essa linha do código e coloque todo o código do método Libera() dentro do:

    protected void img_Click(object sender, ImageClickEventArgs e)
    {
    
    }


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    quarta-feira, 1 de agosto de 2012 21:28
  • Perrot,

    Já que você que ocultar a div detalhe com javascript, e essa será a única finalidade do image button que você esta criando, crie um elemento html, como um <a>, ou um <input> do tipo button, por exemplo:

    Na criação da sua tabela, substitua o código seguinte:
                                ImageButton img = new ImageButton();
                                img.ID = "img" + Registro[0].ToString();
                                img.OnClientClick = "Detalhes()";
                                img.ImageUrl = "~/Imagens/Status-user-busy-icon64.png";
                                tCell.Controls.Add(img);
    Por:

                HtmlLink htmlLinkButton = new HtmlLink(); // Equivalente a tag <a>
                htmlLinkButton.ID = "img" + Registro[0].ToString();
                htmlLinkButton.Attributes.Add("onclick",  "Detalhes();");
                tCell.Controls.Add(htmlLinkButton);
    Sua função javascript pode ficar assim:
    <script type="text/javascript"> 
    function Detalhes() { 
    document.getElementById('<%= divTabela.ClientID %>').style.display = "none";
    document.getElementById('<%= divDetalhes.ClientID %>').style.display = "inline"; 
    }
    </script>
    Att,




    • Editado Vitor Hugo Salgado quarta-feira, 1 de agosto de 2012 21:48 alteração de código
    quarta-feira, 1 de agosto de 2012 21:28
  • Perrot,

    Tente estas duas alterações:

    <script type="text/javascript">
            function Detalhes() {
                window.open("http://www.solun.com.br");
                document.getElementById('tabela-container').style.display = "none";
                document.getElementById('detalhe-container').style.display = "inline"; 
            }    
        </script>
    <div id="tabela-container">
            <asp:UpdatePanel ID="UpdatePanel2" runat="server" >
                  <ContentTemplate>
                        <div ID="divTabela" runat="server">
                            
                            <asp:panel ID="Panel1" runat="server" CssClass="TblCenter" >  
                                <asp:Table ID="Table1" runat="server" >
                                    
                                </asp:Table>
                            </asp:panel>
                        </div>
                    </ContentTemplate>   
            </asp:UpdatePanel>
        </div>
        <div id="detalhe-container" style="display:none;">
            <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                <ContentTemplate>
                    <div ID="divDetalhes" runat="server" style="display: none">
                        <asp:panel ID="Panel2" runat="server" CssClass="TblCenter" >  
                            <asp:Button ID="Button1" runat="server" Text="Liberar" 
                                onclick="Button1_Click" />
                        </asp:panel>
                    </div>
                </ContentTemplate>   
            </asp:UpdatePanel>
        </div>

    Vitor,

    Funcionou perfeitamente. Foi só colocar a div fora do updatepanel.

    Agora preciso fazer o inverso no Button1. 

    Vou fazer e colocar o resultado final depois.

    Obrigado pela ajuda.



    Perrot

    quarta-feira, 1 de agosto de 2012 22:41
  • Então tenho duas ponderações a fazer:

    1 - Você não postou o código todo;

    2 - isso não vai funcionar: img.Attributes.Add("OnClick", "Libera");

    A proposito, eu acho que é isso que está te prejudicando. Muito provavelmente isto está sobrescrevendo o evento OnClick. Retire essa linha do código e coloque todo o código do método Libera() dentro do:

    protected void img_Click(object sender, ImageClickEventArgs e)
    {
    
    }


    Rafael Santos
    E-mail: rsdsantos@gmail.com

    Pequeno Gafanhoto

    Rafael,

    Consegui com a sugestão do Vitor.  Foi só colocar a div fora do updatepanel.  

    Obrigado pela ajuda.

    Abs.


    Perrot

    quarta-feira, 1 de agosto de 2012 22:42
  • function ocultar(camada){

       if(camada.style.visibility = 'visible')

      {

          camada.style.visibility = 'hidden';

          teste.style.visibility='hidden';

       }

    }


    Atenciosamente, Marcio Nogueira Cardoso Pinto.


    quarta-feira, 15 de agosto de 2012 18:07