jQuery and asp:UpdatePanel

When you are using an Update Panel and want to execute a function in jQuery on click of a button within the UpdatePanel, the function runs only once.

For example, If you are using a login screen and the Login button is located within the UpdatePanel. On click of the Login button you want to hide the Login button. This can be done simply using

$(document).ready(function () {
    $('#LoginButton').bind('click', function () {function () {
    $('#LoginButton').bind('click', function () {'#LoginButton').bind('click', function () {
    $("#LoginButton").fadeOut();"#LoginButton").fadeOut();
});

To solve this, use Sys.WebForms.PageRequestManager.getInstance()

See the following code

<script type="text/javascript">
        $(document).ready(function () {
            $('#LoginButton').bind('click', function () {
                $("#LoginButton").fadeOut();
                $("#ClearButton").fadeOut();
            });
            var prm = Sys.WebForms.PageRequestManager.getInstance();
            prm.add_endRequest(function () {
                $('#LoginButton').bind('click', function () {
                    $("#LoginButton").fadeOut();
                    $("#ClearButton").fadeOut();
                });
            });
        });   
    </script>

Thank you