jQuery Datepicker

Ashish Patel

Assign datepicker to runtime/dynamic textboxes in ASP.NET using jQuery

In this short and simple article, we will see how to assign datepicker to runtime textboxes or dynamic textboxes using jQuery in ASP.NET.
Here is code to create three textboxes dynamically (programmatically)
Code behind:

protected void Page_Load(object sender, EventArgs e)
    {
        for (int b = 0; b < 3; b++)
        {
                TextBox txtdate = new TextBox();
                txtdate.ID = "dpicker" + b.ToString();
                txtdate.CssClass = "date";   // class date
                 PlaceHolder1.Controls.Add(txtdate);
            }
    }
&#91;/code&#93;
Here we created three textbox programmatically and assigned <strong>date</strong> to CssClass property of textbox. Now we going to use jQuery UI datepicker plugin to this created textbox class. 

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
   <link type="text/css" rel="Stylesheet" href="http://ajax.microsoft.com/ajax/jquery.ui/1.8.6/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" >
</script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.ui/1.8.6/jquery-ui.min.js" >
</script>
<script type="text/javascript">
    $(function () {
        $(".date").datepicker();
    });
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
               <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
    </div>
    </form>
</body>
</html>

For more information about Datepicker, have a look my this article.
Thanks.