jquery datepicker ms ajax updatepanel doesn't work after post back

Question

So I did some reading of the related questions and had some interesting stuff but did not find my answer, at least did not understand the answer.

I am very new to AJ

Answer 1

Another easy way is to take out the date text box from the Update Panel. This way, the post back made by the Update Panel does not affect the date text box

Answer 2

I know this post is old - but just place your jquery datepicker outside of the update panel - should work 100%...

Answer 3

When use asp:ScriptManager and Sys.WebForms.PageRequestManager does not working, you can try to use following code:

Sys.Application.add_load(LoadHandler);

//This load handler solved update panel did not bind date picker after partial postback 
function LoadHandler() {
    $(document).ready(function () {
        $(".datepicker").datepicker({
            dateFormat: "M d, yy",
            changeMonth: true,
            changeYear: true,
            onSelect: function (dateText, ubst) { 
               //your code here... 
            }
        }).val();
    });
}

Answer 4

I know this is old but ... try replace:

$(document).ready(function() {

with:

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(function () {

Answer 5

Instead of doing this there is a simple alternative.

In the postback of the element in update panel add this code

ScriptManager.RegisterStartupScript(Me, Me.GetType(), "asddas", "getjquerydate();",   True)

And this in javascript

function getjquerydate() {

$(".datepicker").datepicker({
    numberOfMonths: 2,
    showButtonPanel: true,
    minDate: 1,
    dateFormat: 'dd/mm/yy',
    showOn: "button",
    buttonImage: "images/calendar.gif",
    buttonImageOnly: true
});

}

After Partial postback in updated panel it again call the datepicker function

Answer 6

$(document).ready(function () {
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
        Sys.WebForms.PageRequestManager.getInstance().beginAsyncPostBack();
        function EndRequestHandler(sender, args) {
            $('.mydatepickerclass').datepicker({ dateFormat: 'dd-mm-yy' });
        }
    });

You can do like this. in this case it will work always ;))