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 :)

Calling a Server side function from Javascript

Many of us needs a server side function to be called from JavaScript. We can do this easily using __doPostBack

as

Javascript Code

function CallServerCode()

{

__doPostBack('btnTest', '');

}

and in HTML

<­button type="­button" onclick="javascript:CallServerCode();">Call Server Code<­/­button­>

<­asp­:­linkbutton id="btnTest" runat="server" text="ASP .Net Button"­> <­/­asp­:­linkbutton>

and the Server side code

Protected Sub btnHidden_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnTest.Click

Response.Write("Hello")

End Sub

Now note that whenever the client button with caption "Call Server Code" will be clicked it will call Serverside event of btnTest using Javascript.