Problema utilizando Jquery e Ajax

Question

Olá bom dia,

Eu tenho uma função jquery que é carregada no load do meu form (e ao mesmo tempo estou utilizando ajax update panel):

    <script type="text/javascript" language="javascript">
        function JQuery() {
            var slimbox2Options = {
                overlayOpacity: 0.6,
                resizeEasing: "easeOutElastic",
                captionAnimationDuration: 1,
                counterText: "Image {x} sur {y}",
                closeKeys: [27, 70],
                nextKeys: [39, 83],
                previousKeys: [37, 80]
            };

            $(".slimbox2").slimbox2(slimbox2Options);
        }

        $(document).ready(function () {
            JQuery();
        });

        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function () {
            JQuery();
        });
    </script>

E ainda, dentro do meu form eu tenho um checkbox que ao clicar nele, é realizado um postback, porém quando isso acontece, meu jquery pára de funcionar!

Agradeço qualquer ajuda.

Obrigada

Answer 1

Ao invés de usar

 $(document).ready(function () {
            JQuery();
        });

tente usar

function pageLoad()

{

    JQuery();

}

Answer 2

Issoa contece porque o JavaScript perde a referencia ao atualizar apenas o UpdatePanel. Usando como o Guilherme sugeriu funciona.

Uma gambiarra muito ruim mas que também funcionaria, seria replicar o código em JavaScript - no caso o JQuery - dentro do UpdatePanel.

---

Rafael Santos

Observações:
1. Selecione a opção "Habilitar o Live Alerts por Padrão" nas suas configurações para que possa acompanhar em tempo real as atividades relacionadas a sua Thread;
2. Não abandone sua Thread. Ao perguntar, fique atento às respostas; ao encontrar uma solução, compartilhe;
3. As pessoas que dedicam seu tempo na busca por soluções para você não ganham nada em troca. Valorize-as e em forma de agradecimento pontue as respostas corretas.

"Quem disse que não escrevo poesias? A diferença é que as minhas começam com using System;"

Answer 3

Obrigada pela resposta, mas continuou não funcionando ao dar o postback na página.

Rafa, você quis dizer colocar o meu código acima dentro do update panel / content template? Fiz isso também, mas não funcionou :(

Answer 4

Juliana,

Retornou algum erro de javascript?

Answer 5

Oi Guilherme,

Está dando o erro: Type error: $(...).slimbox2 is not a function

Isso é estranho porque o slimbox2 está funcionando, isto é, no primeiro load da página, o jquery funciona, quando clico na imagem, ela é ampliada na tela!

Então se está dando esse erro de jquery / javascript, porque tudo está funcionando num primeiro momento?

Lembrando que ao clicar num checkbox que faz um postback na página, esse jquery pára de funcionar.

    <script type="text/javascript" language="javascript">
        function pageLoad() {
            var slimbox2Options = {
                overlayOpacity: 0.6,
                resizeEasing: "easeOutElastic",
                captionAnimationDuration: 1,
                counterText: "Image {x} sur {y}",
                closeKeys: [27, 70],
                nextKeys: [39, 83],
                previousKeys: [37, 80]
            };

            $(".slimbox2").slimbox2(slimbox2Options);
        }
    </script>

Answer 6

Juliana,

Se você debugar, as propriedades do controle slimbox2 são exibidas?

Answer 7

Atualizei a versão para o jquery.1.8.3.js e passou a funcionar!

Obrigada