After Post Back my jQuery code not working

问题:

I have server side button. First time jquery is working fine but next time jQuery not wroking. I am using jQuery inside Update Panel.

Below is my Jquery code.

<script type="text/javascript" src="../../js/jquery-ui-1.11.4.min.js"></script> 
<script type="text/javascript">            
(function ($) {
    $('.mv-spinner').spinner(), $('.mv-action').button(),
    $('.table-mv-vouchers').tooltip(), $('.table-mv-vouchers select').selectmenu() 
})(jQuery)
</script> 

Also I have used my code in page load function but not working.

 protected void Page_Load(object sender, EventArgs e)
 {      
        Page.ClientScript.RegisterStartupScript(typeof(UpdatePanel), "scrg", "<script type='text/javascript' src='../../js/jquery-ui-1.11.4.min.js'></script>");
        Page.ClientScript.RegisterStartupScript(typeof(UpdatePanel), "scr", "<script type='text/javascript'>  (function ($) { $('.mv-spinner').spinner(), $('.mv-action').button(), $('.table-mv-vouchers').tooltip(), $('.table-mv-vouchers select').selectmenu() })(jQuery) </script>");
 }

How I will fix this issue? jQuery does not perform after postback. Thanks in advance!

回答1:

Your initialization will run only on document ready (not on postback). Since you place your control inside UpdatePanel, anything will updated after postback.

Try with the below suggestion

You need to recreate the Jquery Codes on postbacks like given below

<script type="text/javascript"> 
    $(document).ready(function() {
        //jquery code
    });

    var parameter = Sys.WebForms.PageRequestManager.getInstance();

    parameter.add_endRequest(function() {
        //jquery code again for working after postback
    });
</script>

this is the solution got once i got the same issue and worked fine for me..check

回答2:

Change it from:

$('.ClassName').click(function(e) {
/////
});

to:

$(document).on("click", ".ClassName", function (e) {
/////
});