Why Jquery Datetime picker is lost after postback?

Question

I have used Jquery DateTime Picker. It works fine at first page load but stop working after postback or any button click. why ? I don't understand why ?

in head:

<script>
    $(function () {
        $("#<%= txtBoxDateOfBirth.ClientID %>").datepicker();
    });
</script>

in pageload of asp.net:

StringBuilder scripts = new StringBuilder();
scripts.Append("<script type='text/javascript'>");
scripts.Append("$(function () {");
scripts.Append("$('txtBoxDateOfBirth')");
scripts.Append("});");
scripts.Append("</script>)");

Page.ClientScript.RegisterStartupScript(this.GetType(), txtBoxDateOfBirth.ClientID + "_ReadyScript", scripts.ToString());

but still it stops working upon any button click or postback, why ?

Answer 1

Is txtBoxDateOfBirth placed inside an UpdatePanel ? if it is, the javascript needs to be registered everytime the panel is updated.

What is the point of the js in the app code ? You just wrap the txtBoxDateOfBirth in a jQuery object and do nothing with it.

Side note : Page.RegisterStartupScript is depracted, you should use ClientScriptManager.RegisterStartupScript

Answer 2

I think you should write your page load code like this(not in postback condision):

protected void Page_Load(object sender, EventArgs e)
    {
        StringBuilder scripts = new StringBuilder();
        scripts.Append("<script type='text/javascript'>");
        scripts.Append("$(function () {");
        scripts.Append("$('txtBoxDateOfBirth').datepicker();");
        scripts.Append("});");
        scripts.Append("</script>)");

        Page.ClientScript.RegisterStartupScript(this.GetType(), txtBoxDateOfBirth.ClientID + "_ReadyScript", scripts.ToString());
    }

Answer 3

Use in page Load IsPostBack method and place your code inside if condition

 if (!Page.IsPostBack)
 {
    ...  ...  .. 
 }