.NET Articles, Web Devploment, ASP.NET, HTML, Sharepoint 2010, Aamir Hasan
Advertise Here
Advertise Here
Advertise Here
Advertise Here
Advertise Here
Advertise Here
Advertise Here
Advertise Here
Advertise Here



Posted by Aamir Hasan   on Tuesday, November 22, 2011 Total Views:  

This example demonstrate how to use jQuery UI Datepicker popup Calender with Microsoft jQuery UI libaray is also avaible on CDN hosted. I have used input type textbox, added Microsoft CDN jQueryUI 1.8.16 libarary and CDN CSS Style sheet file for the jQuery datepicker. You can download jQuery UI 1.8.16 libarary from here. You can download entire libarary from Microsoft CDN is also avaible on HTTPS. Let’s start.


Note: I have used Microsoft Visual Studio 2011 Developer Preview.


Step 1: Open your Microsoft Visual Studio 2011 Developer Preview, click File -> New Web Site. Choose ASP.NET web site from the installed template. I have chosen .NET Framework 4.5; you can choose Framework from dropdownlist as shown in below figure.

Step 2: Right click on your web site, click on Add New Item, Add New Item window will open, select Web Form, give name jQueryUI-Calendar.aspx  and press Add button as shown.


Step 3:  Add Microsoft jQuery 1.7 libraries, jQuery UI 1.8.16 libarary and CSS style sheet file under the head section of your aspx page as shown below.

    <script src="" type="text/javascript"></script>

    <script src="" type="text/javascript"></script>

    <link href=""

        rel="stylesheet" type="text/css"/>

Note: jQuery all themes are avaible on Microsoft, google and jquery CDN hosted.

Step 4:  Drag and drop input textbox in your aspx as shown below and it will generate the id named "Text1" in your page.

Step 5:  Copy and paste following code under the head section as given below.

    <script type="text/javascript">





Run your web site and click on the input textbox, you will see the Datepicker to select the date.

You can display month and year dropdown list in jQuery datepicker by passing changeMonth and changeYear boolen parameter as shown below code.

 <script type="text/javascript">








You can restrict the date range as given in following code.

<script type="text/javascript">




                maxDate:+ 3




In the above code, you can select min 15 days and max 3 days from current date as shown in below figure.

For more options of datepicker to view, click here.

Note:  Microsoft CDN has been changed from to to increase the performace. However, old name domain will remain same. But is not recommended.


Download (145.38 kb)

Click here to see live demo

Protected by Copyscape Online Plagiarism Tool

Comments (4) -

Dave Hoeft
Dave Hoeft United States
1/11/2016 11:42:36 AM #

What do you advise to me?

Erica Kobialka
Erica Kobialka United States
7/1/2016 4:57:13 PM #

Whoa! This blog looks just like my old one! It's on a entirely different topic but it has pretty much the same page layout and design. Great choice of colors!

Joshua Schleppenbach
Joshua Schleppenbach United States
7/3/2016 4:28:02 PM #

It's a shame you don't have a donate button! I'd certainly donate to this outstanding blog! I suppose for now i'll settle for book-marking and adding your RSS feed to my Google account. I look forward to fresh updates and will share this website with my Facebook group. Chat soon!

Robbie Pallone
Robbie Pallone United States
7/4/2016 5:13:30 PM #

Hello there, just turned into alert to your weblog via Google, and located that it is really informative. I¡¯m going to be careful for brussels. I will be grateful for those who continue this in future. Numerous other folks might be benefited from your writing. Cheers!

Odis Kahaleua
Odis Kahaleua United States
7/18/2016 7:53:28 AM #

Write more, thats all I have to say. Literally, it seems as though you relied on the video to make your point. You definitely know what youre talking about, why waste your intelligence on just posting videos to your blog when you could be giving us something enlightening to read?

Amalia Amarillas
Amalia Amarillas United States
8/11/2016 6:34:25 PM #

Masalah krisis kehilangan kepercayaan diri juga menjadi keluhan yang sering masuk ke kustomer service

facebook password hacking
facebook password hacking United States
8/28/2016 5:42:24 PM #

That is very interesting, You are an overly skilled blogger. I have joined your rss feed and look forward to seeking extra of your fantastic post. Additionally, I have shared your website in my social networks. you can check my blog here:

ib fbs rebate
ib fbs rebate United States
11/10/2016 6:40:03 AM #

Using mozila firefox seting from an other windows?

Brooks United States
7/29/2017 6:23:56 AM #

magnificent issues altogether, you just gained a emblem new reader. What may you recommend about your publish that you made some days ago? Any certain?

Tim Allen
Tim Allen United States
1/24/2020 1:04:12 AM #

Hey, This article posted at this website is really good.

visit United States
5/24/2021 6:19:47 AM #

Fantastic goods from you, man. I've understand your stuff previous to and you are just extremely fantastic. I really like what you have acquired here, really like what you are stating and the way in which you say it. You make it entertaining and you still take care of to keep it sensible. I can't wait to read far more from you. This is really a tremendous site.

Add comment

  Country flag

  • Comment
  • Preview

Advertizement 1
Advertizement 2
Advertizement 3
Advertizement 4
Advertizement 5