none
Problemas com arquivo .js

    Question

  • Bom dia, pessoal.

    Estou com uma dúvida cruel, vou tentar passar o meu problema da forma mais clara.

     

    Tenho um sistema com 4 páginas(.aspx), cada página vou precisar usar várias/diferentes functions Javascripts, até ai ok, eu estava colocando todo o código da funções em cada página, porém isso estava poluindo minhas .aspx.

    Então, resolvi criar um arquivo .js independente e jogar todas as funções Javascript que vou precisar dentro desse arquivo e nas minhas .aspx só referenciar esse arquivo e chamar as funções que necessito pra cada página, ok.

    Mas, cada função Javascript eu preciso pegar especificios controles de uma .aspx. Por exemplo, eu tenho uma função TrocarCor() que pega 2 div's e faz com que eles fiquem piscando, só que quero usar essa função para outra página também, como posso passar esses controles como parâmetro, sei lá, qualquer coisa, estou com muita dúvida como vou referenciar uma função para 4 páginas com parâmetros diferentes.

     

    Espero que tenham entendido, estou preso a isso.

    Agradeço desde já a ajuda.

    Obrigado !

    Monday, September 12, 2011 11:26 AM

Answers

  • olá amigo,

    o que vc quer fazer é simples. Segue abaixo:

    - Primeiro crie a função que aceitará dois parametros (ou mais, depende de vc) que serão suas divs. Essa função estará no seu arquivo .js e será generica, ou seja, servirá pra quaisquer duas divs de quaisquer que seja a pagina que tenha referencia ao .js.

    function Testando(div1, div2)

    {

    }

    - Depois em uma pagina aspx, faça a referencia do arquivo .js e chame a função "Teste" quando quiser passando como parametro a instancia de suas divs. Exemplo abaixo:

     window.onload = function () {

                var div1 = document.getElementById("minhadiv1");
                var div2 = document.getElementById("minhadiv2");

                Teste(div1, div2);

            };

    Nesse caso, estou chamando a função logo que o documento é inicializado, utilizando o evento "onload". Primeiro cria-se uma instancia de cada div que vc quer utilizar na função (divi1 e div2). Depois chama a função passando como parametros as instancias de suas divs.

    - Ok. Passando as instancias para a função agora basta manipular as suas divs como quiser na função "Teste". Exemplo abaixo:

    function Testando(div1, div2)

    {

    div1.style.color = '#cccccc';

    div2.style.color = '#336699';

    // vc pode agora manipular como quiser

    }

     

    - Assim vc estará apto a chamar a função de qualquer aspx, passando como parametros sempre as instancias de suas divs que deseja manipular.

    Qualquer duvida é só postar.

    Espero ter ajudado. Abraço!

     

    • Marked as answer by Progamador.C Tuesday, September 13, 2011 2:34 PM
    Tuesday, September 13, 2011 12:35 PM
  • ha cara,

    acabei de perceber o erro que vc ta cometendo. Quando vc faz isso:

    <script type="text/javascript">
                    var div1 = document.getElementById('ctl00_cphConteudo_divFase9');                
                    var div2 = document.getElementById('ctl00_cphConteudo_divFase6');
                    var div3 = document.getElementById('ctl00_cphConteudo_divFase7');        
            
            
                alerta(div1, div2, div3);               
                
            </script>

    o script está sendo executado antes que o Documento da pagina tenha sido carregado. Assim o browser não terá conhecimento do html renderizado. Sendo assim, voce não conseguirá instanciar qualquer elemento. Para ter certeza que o documento está complemente renderizado utilize o evento "window.onload" como eu postei acima. Ou então execute seu script em algum evento de um botão.

    • Marked as answer by Progamador.C Tuesday, September 13, 2011 2:34 PM
    Tuesday, September 13, 2011 1:08 PM
  • Vc deve ta achando alguns erros com isso. Passar parametros para essa função (setInterval e setTimeOut é confuso)...

    Faz assim então:

    string meuscript = "window.onload = function() { 

                                       setinterval('ChamaAlerta()', 1000);

                                " }; " +

                                "function ChamaAlerta() { " +

                                     "var div1 = document.getElementById('minhadiv1');" +

                                     "var div2 = document.getElementById('minhadiv2');" +

                                     "var div3 = document.getElementById('minhadiv3');" +

                                      "alerta(div1,div2,div3);" +

                                " }; "

     

    Assim vai funcionar que é uma maravilha rsrs.

    Abraço!

    • Marked as answer by Progamador.C Tuesday, September 13, 2011 2:34 PM
    Tuesday, September 13, 2011 2:23 PM
  • Precisei vim compartilhar com vocês.

     

    Marcos, acabei apagando tudo e fazendo de uma forma PERFEITA o que eu queria.

    E sem esse trabalho de parâmetros no CS e tudo mais.

     

    Eu simplesmente coloquei minha função no meu arquivo efeitos.js:

     

          function alertaMCI(teste)
                  {
                    switch(teste)
                    {
                        case 1:
                        var div9 = document.getElementById('ctl00_cphConteudo_divFase9'); 
                            
                        if(div9.style.backgroundColor=="lime" || div9.style.display == 'none')                
                        {
                        div9.style.backgroundColor="red";
                        div9.style.display = 'block';                    
                        }                
                        else
                        {           
                        div9.style.display = 'none';
                        }
                        break;                
                    }              
                  }     
                
    


    Referenciei na minha .aspx dessa forma:

     

     <script type="text/javascript">
                    int teste;
                    alertaMCI(teste);            
            </script>
    

     

    E chamei a função no meu .CS assim:

     

    ScriptManager.RegisterStartupScript(this, this.GetType(), "piscar", "window.onload = function(){setInterval('alertaMCI(1)', 500)};", true);
    

     

     

     

    E pronto, ficou perfeito.

    Não precisei passar DIV como parâmetro nem porra nenhuma.

    Fazendo esse Switch e passando um valor como parâmetro ja foi o suficiente. Ficou melhor do que eu imaginava...

     

    Perfeito.

     

    Segue a dica pra quem precisar um dia.

    Abraços

    • Marked as answer by Progamador.C Wednesday, September 14, 2011 12:33 PM
    Wednesday, September 14, 2011 12:33 PM

All replies

  • E não quero colocar todo o código da função em cada página, a idéia de criar um arquivo .js independente era exatamente para isso...
    Monday, September 12, 2011 11:28 AM
  • Ninguém? =/

     

     

    Monday, September 12, 2011 12:53 PM
  • Cara, como está a sua função javascript que muda a cor das divs?

    Uma possível solução para isso seria colocar o id de cada div como parâmetro da função. Aí, em cada aspx você chama a função com os ids das divs que você quer mudar de cor. Isso seria uma solução bem simples.

    Espero ter esclarecido. Qualquer coisa, só perguntar!

    Abs!

    Monday, September 12, 2011 2:26 PM
  • Vinicius,

     

    Eu fiz isso e não deu certo, segue minha função dentro do meu arquivo efeitos.js:

     

     function alerta(pisca1, pisca2, pisca3)
                {                            
                    //var pisca1 = document.getElementById('ctl00_cphConteudo_divFase9');
                    //var pisca2 = document.getElementById('ctl00_cphConteudo_divFase6');
                    //var pisca3 = document.getElementById('ctl00_cphConteudo_divFase7');               
                                    
                    if(pisca1.style.backgroundColor=="lime" || pisca1.style.display == 'none')                
                    {
                        pisca1.style.backgroundColor="red";
                        pisca1.style.display = 'block';                    
                    }                
                    else
                    {           
                        pisca1.style.display = 'none';
                    }
                    
                    if(pisca2.style.backgroundColor=="lime" || pisca2.style.display == 'none')                
                    {
                        pisca2.style.backgroundColor="red";
                        pisca2.style.display = 'block';
                    }                
                    else
                    {
                        pisca2.style.display = 'none';
                    }
                    
                    if(pisca3.style.backgroundColor=="lime" || pisca3.style.display == 'none')                
                    {
                        pisca3.style.backgroundColor="red";
                        pisca3.style.display = 'block';
                    }                
                    else
                    {
                        pisca3.style.display = 'none';
                    }
                }          
    

     

    Ai na minha .aspx eu chamei assim:

     

     <script type="text/javascript" language="javascript" src="../Scripts/efeitos.js"></script>
    
            <script type="text/javascript">
                var pisca1 = document.getElementById('ctl00_cphConteudo_divFase9');
                var pisca2 = document.getElementById('ctl00_cphConteudo_divFase6');
                var pisca3 = document.getElementById('ctl00_cphConteudo_divFase7');    
                
                alerta(pisca1, pisca2, pisca3);
            </script>
    

     

    O valor está retornando nulo, ja tentei de tudo, ja descomentei as variaveis no arquivo e chamei por lá, já chamei só a função sem definir os meus div's, ja fiz de tudo HAHA

     

    Abraçooos

    Monday, September 12, 2011 2:29 PM
  • Alguém? =/

    Monday, September 12, 2011 4:27 PM
  • Cara, tente fazer sua função assim:

    function alerta(id1, id2, id3) {
        var pisca1 = document.getElementById(id1);
        var pisca2 = document.getElementById(id2);
        var pisca3 = document.getElementById(id3);
    
        if (pisca1.style.backgroundColor == "lime" || pisca1.style.display == 'none') {
            pisca1.style.backgroundColor = "red";
            pisca1.style.display = 'block';
        }
        else {
            pisca1.style.display = 'none';
        }
    
        if (pisca2.style.backgroundColor == "lime" || pisca2.style.display == 'none') {
            pisca2.style.backgroundColor = "red";
            pisca2.style.display = 'block';
        }
        else {
            pisca2.style.display = 'none';
        }
    
        if (pisca3.style.backgroundColor == "lime" || pisca3.style.display == 'none') {
            pisca3.style.backgroundColor = "red";
            pisca3.style.display = 'block';
        }
        else {
            pisca3.style.display = 'none';
        }
    }
    
    


    Para chamar a função, passe como parâmetros strings com os ids dos elementos que vc quer fazer os efeitos. Exemplo:

    alerta('div1', 'div2', 'div3');

    Assim você não precisa pegar os elementos toda vez que quiser chamar a função.

    E para chamar assim que a página carrega, use o evento window.onload, dessa forma:

    window.onload = function () {
        alerta('div1', 'div2', 'div3');
    }
    
    


    Espero que isso te ajude!

    Abs!

    Monday, September 12, 2011 5:03 PM
  • Cara, os valores ainda continuam vindo NULL.

     

    =/

    Monday, September 12, 2011 5:13 PM
  • Que valores? As variáveis chamadas pisca?

    Tente colocar a chamada da função em um botão para ver se ela está funcionando normalmente.

    Monday, September 12, 2011 6:23 PM
  • Sim, as variaveis pisca estão retornando NULL.

    =/

     

    Não sei mais o que fazer...

    Tuesday, September 13, 2011 10:47 AM
  • Alguém?

     

    Ja vasculhei o google inteiro HAHA

    Não vejo exemplos iguais ao meu problema.

    Tuesday, September 13, 2011 11:19 AM
  • Na verdade, eles estão voltando undefined =/
    Tuesday, September 13, 2011 12:18 PM
  • olá amigo,

    o que vc quer fazer é simples. Segue abaixo:

    - Primeiro crie a função que aceitará dois parametros (ou mais, depende de vc) que serão suas divs. Essa função estará no seu arquivo .js e será generica, ou seja, servirá pra quaisquer duas divs de quaisquer que seja a pagina que tenha referencia ao .js.

    function Testando(div1, div2)

    {

    }

    - Depois em uma pagina aspx, faça a referencia do arquivo .js e chame a função "Teste" quando quiser passando como parametro a instancia de suas divs. Exemplo abaixo:

     window.onload = function () {

                var div1 = document.getElementById("minhadiv1");
                var div2 = document.getElementById("minhadiv2");

                Teste(div1, div2);

            };

    Nesse caso, estou chamando a função logo que o documento é inicializado, utilizando o evento "onload". Primeiro cria-se uma instancia de cada div que vc quer utilizar na função (divi1 e div2). Depois chama a função passando como parametros as instancias de suas divs.

    - Ok. Passando as instancias para a função agora basta manipular as suas divs como quiser na função "Teste". Exemplo abaixo:

    function Testando(div1, div2)

    {

    div1.style.color = '#cccccc';

    div2.style.color = '#336699';

    // vc pode agora manipular como quiser

    }

     

    - Assim vc estará apto a chamar a função de qualquer aspx, passando como parametros sempre as instancias de suas divs que deseja manipular.

    Qualquer duvida é só postar.

    Espero ter ajudado. Abraço!

     

    • Marked as answer by Progamador.C Tuesday, September 13, 2011 2:34 PM
    Tuesday, September 13, 2011 12:35 PM
  • Fiz exatamente igual você disse.

     

    E continua dando erro de "Objeto Necessário", retorna NULL ainda.

     

    Olha como fiz:

     

     function alerta(id1, id2, id3)
                {                           
                  
                                    
                    if(id1.style.backgroundColor=="lime" || id1.style.display == 'none')                
                    {
                        id1.style.backgroundColor="red";
                        id1.style.display = 'block';                    
                    }                
                    else
                    {           
                        id1.style.display = 'none';
                    }
                    
                    if(id2.style.backgroundColor=="lime" || id2.style.display == 'none')                
                    {
                        id2.style.backgroundColor="red";
                        id2.style.display = 'block';
                    }                
                    else
                    {
                        id2.style.display = 'none';
                    }
                    
                    if(id3.style.backgroundColor=="lime" || id3.style.display == 'none')                
                    {
                        id3.style.backgroundColor="red";
                        id3.style.display = 'block';
                    }                
                    else
                    {
                        id3.style.display = 'none';
                    }
                }          
    

     

    E to chamando na minha .aspx assim:

     <script type="text/javascript">
                    var div1 = document.getElementById('ctl00_cphConteudo_divFase9');                
                    var div2 = document.getElementById('ctl00_cphConteudo_divFase6');
                    var div3 = document.getElementById('ctl00_cphConteudo_divFase7');        
            
            
                alerta(div1, div2, div3);               
                
            </script>
    

     

    O que pode estar errado?

    Não é possível...

     

    Esqueci de falar que tenho uma Master Page em minha aplicação, mas acredito que não afete em nada né?

     

    Tuesday, September 13, 2011 12:50 PM
  • vc deve estar referenciando pelo id errado. Faça o teste antes de chamar sua função "alerta". Teste suas instancias antes de passar elas para a função. Faça um "if(div1 != null") ou alert(div1") e veja o que o browse diz. Se ele mostrar no alert algo como "object" seu objeto terá sido instanciado corretamente, senão ha algum erro no id que vc esta utilizando.

    poste aqui o que o browser vai dizer de seu teste. Faça isso para as 3 divs.

    Tuesday, September 13, 2011 1:03 PM
  • Cara, funcionou.

     

    Te amo HAHA

     

    Porém, tem um probleminha.

    Só funcionou quando eu coloquei o window.onload.

     

    Até ai beleza, só que quero chamar via .CS, dessa forma:

    ScriptManager.RegisterStartupScript(this, this.GetType(), "piscar", "window.onload = function(){setInterval('alerta()', 500)};", true);
    

     

    E colocando dessa forma e tirando o window.onload da .aspx, não funciona =/
    Tuesday, September 13, 2011 1:06 PM
  • ha cara,

    acabei de perceber o erro que vc ta cometendo. Quando vc faz isso:

    <script type="text/javascript">
                    var div1 = document.getElementById('ctl00_cphConteudo_divFase9');                
                    var div2 = document.getElementById('ctl00_cphConteudo_divFase6');
                    var div3 = document.getElementById('ctl00_cphConteudo_divFase7');        
            
            
                alerta(div1, div2, div3);               
                
            </script>

    o script está sendo executado antes que o Documento da pagina tenha sido carregado. Assim o browser não terá conhecimento do html renderizado. Sendo assim, voce não conseguirá instanciar qualquer elemento. Para ter certeza que o documento está complemente renderizado utilize o evento "window.onload" como eu postei acima. Ou então execute seu script em algum evento de um botão.

    • Marked as answer by Progamador.C Tuesday, September 13, 2011 2:34 PM
    Tuesday, September 13, 2011 1:08 PM
  • Eu preciso de uma condição em cima dessa função, por isso preciso colocar no .CS, não quero que ela execute sempre...
    Tuesday, September 13, 2011 1:11 PM
  • vc está adicionando o script a pagina pelo .cs??
    Tuesday, September 13, 2011 1:15 PM
  • Sim, preciso que essa função só execute quando eu "mandar", através de uma condição.

     

    Mas dessa forma como eu disse, está dando erro, só dá certo com o window.onload na .aspx =/

    Quero assim:

    ScriptManager.RegisterStartupScript(this, this.GetType(), "piscar", "window.onload = function(){setInterval('alerta()', 500)};", true);
    

     

    Tuesday, September 13, 2011 1:17 PM
  • Pelo que entendi vc consegue adicionar o script pelo .cs normalmente pelo código acima e o que quer é condicionar a execução da função "alerta". É isso mesmo? Se for basta colocar o "if" no seu script com a sua condição. 

    Para eu ajuda-lo vc deve dizer qual a condição que quer ou quando quer que ela execute. Do jeito acima ela executará assim que a pagina abrir e não é isso que quer pelo visto...

    Tuesday, September 13, 2011 1:23 PM
  • Não, na verdade eu já tenho essa condição, esse script no .CS não funciona agora, eu tenho que comentar ele, e na .aspx colocar window.onload que ai sim ele funciona.

     

    else

    {

    panelEstacaoCabina.Visible =

    true;

    lblCabine.Text =

    "CABINA";

     

    //ScriptManager.RegisterStartupScript(this, this.GetType(), "piscar", "window.onload = function(){setInterval('alerta()', 500)};", true);
     

    }

     

     

    Dessa forma comentado, o que você me ajudou a fazer, funciona, se eu descomento, já era, dá erro...

    Tuesday, September 13, 2011 1:25 PM
  • Só que não quero window.onload na .ASPX, quero manipular essa chamada pelo .CS..
    Tuesday, September 13, 2011 1:26 PM
  • Que tipo de erro da? Erro no asp.net ou erro de script??
    Tuesday, September 13, 2011 1:30 PM
  • Erro no script, de objeto necessário novamente =/ maldito script !
    Tuesday, September 13, 2011 1:31 PM
  • Vc ta chamando sua função "alerta" sem passar os parametros...
    Tuesday, September 13, 2011 1:33 PM
  • MEsmo assim dá erro:

     

    ScriptManager

    .RegisterStartupScript(this, this.GetType(), "piscar", "window.onload = function(){setInterval('alerta(div1, div2, div3)', 500)};", true);

     

     

    Tuesday, September 13, 2011 1:34 PM
  • Só que agora é esse erro:

     

    Erro em tempo de execução do Microsoft JScript: 'div1' não está definido

    Tuesday, September 13, 2011 1:38 PM
  • agora vc ta passando os parametros "div1", "div2", "div3". Mas aonde vc esta declarando essas variaveis?? rsrsrs

    Vc precisa declarar as variaveis, instanciar e passar pra função como vc tinha feito em um script acima. Como essa janela ja ta ficando mt grande e demorada, me add no msn que te ajudo mais rapidamente.

    marcosmarques007@hotmail.com

    Abraço!

    Tuesday, September 13, 2011 1:40 PM
  • Não tenho como acessar o msn agora cara =/

     

    Eu declaro essas variaveis dentro RegisterScript?

    Ou no próprio .CS?

    Tuesday, September 13, 2011 1:41 PM
  • tem que ser na string que correponde ao seu script, então no registerscript.

    Pra ficar uma coisa mais oirganizada declara uma string e joga teu script dentro dessa string e depois joga a string no register.

    faz assim:

    string meuscript = "window.onload = function() { 

                                "var div1 = document.getElementById('minhadiv1');" +

                                "var div2 = document.getElementById('minhadiv2');" +

                                "var div3 = document.getElementById('minhadiv3');" +

                                "alerta(div1,div2,div3);" +

                                " }; ";

    ScriptManager.RegisterStartupScript(this, this.GetType(), "piscar", meuscript, true);

    Testa agora!

    Tuesday, September 13, 2011 1:48 PM
  • e aí cara, deu certo??

    se ta feito, vota aí beleza?

    Abraço!

    Tuesday, September 13, 2011 2:14 PM
  • Cara, to tentando adequar com setinterval, que faltou ai no script HAHA

    Tuesday, September 13, 2011 2:16 PM
  • Vc deve ta achando alguns erros com isso. Passar parametros para essa função (setInterval e setTimeOut é confuso)...

    Faz assim então:

    string meuscript = "window.onload = function() { 

                                       setinterval('ChamaAlerta()', 1000);

                                " }; " +

                                "function ChamaAlerta() { " +

                                     "var div1 = document.getElementById('minhadiv1');" +

                                     "var div2 = document.getElementById('minhadiv2');" +

                                     "var div3 = document.getElementById('minhadiv3');" +

                                      "alerta(div1,div2,div3);" +

                                " }; "

     

    Assim vai funcionar que é uma maravilha rsrs.

    Abraço!

    • Marked as answer by Progamador.C Tuesday, September 13, 2011 2:34 PM
    Tuesday, September 13, 2011 2:23 PM
  • Valeu cara, de verdade.

     

    Pela paciência enorme e pela ajuda HAHA

     

    Abração, já votei tudo..

    Tuesday, September 13, 2011 2:34 PM
  • na hora.

    Abraço!

    Tuesday, September 13, 2011 2:39 PM
  • Precisei vim compartilhar com vocês.

     

    Marcos, acabei apagando tudo e fazendo de uma forma PERFEITA o que eu queria.

    E sem esse trabalho de parâmetros no CS e tudo mais.

     

    Eu simplesmente coloquei minha função no meu arquivo efeitos.js:

     

          function alertaMCI(teste)
                  {
                    switch(teste)
                    {
                        case 1:
                        var div9 = document.getElementById('ctl00_cphConteudo_divFase9'); 
                            
                        if(div9.style.backgroundColor=="lime" || div9.style.display == 'none')                
                        {
                        div9.style.backgroundColor="red";
                        div9.style.display = 'block';                    
                        }                
                        else
                        {           
                        div9.style.display = 'none';
                        }
                        break;                
                    }              
                  }     
                
    


    Referenciei na minha .aspx dessa forma:

     

     <script type="text/javascript">
                    int teste;
                    alertaMCI(teste);            
            </script>
    

     

    E chamei a função no meu .CS assim:

     

    ScriptManager.RegisterStartupScript(this, this.GetType(), "piscar", "window.onload = function(){setInterval('alertaMCI(1)', 500)};", true);
    

     

     

     

    E pronto, ficou perfeito.

    Não precisei passar DIV como parâmetro nem porra nenhuma.

    Fazendo esse Switch e passando um valor como parâmetro ja foi o suficiente. Ficou melhor do que eu imaginava...

     

    Perfeito.

     

    Segue a dica pra quem precisar um dia.

    Abraços

    • Marked as answer by Progamador.C Wednesday, September 14, 2011 12:33 PM
    Wednesday, September 14, 2011 12:33 PM