jQuery not working in UpdatePanel

If you are reading this then this means that you are facing the same problem which I faced and the problem is that jQuery functions are not working after any of the event occurred within the Updatepanel.

I mean suppose you are showing and hiding some DIV using jQuery .show() amd .hide(), the DIV resides in an updatepanel where you have another button as well which is a server side button and calls the Server side event using AJAX (update panel), after doing your work of this button you try to show/hide the DIV but you get surprised as the jQuery function is no more being called.

You jQuery code would be like this

<script type="text/javascript" language="javascript">

  $(document).ready(function () {

      $("#btnTest").click(function () {

       $("#dvTest").show(); //Here you could be having hide/toggle/slideToggle etc etc

    });

  });

</script>

Solution

So whats the solution? Solution is very easy and simple. Use your jQuery code as following

<script type="text/javascript" language="javascript">

  $(document).ready(function () {

     $('#btnTest').live('click', function () {

        $('#dvTest').show(); //Here you could be having hide/toggle/slideToggle etc etc

        return false;

     });

  });

</script>

Hope your issue is solved?

Happy coding :)