Date Picker Custom Control in ASP.NET

• Download DatePicker_DLL - 19.71 KB

Introduction

This article is all about the custom control for date picker. This date picker can be used anywhere in asp.net projects. Just go to toolbox. In general section click on 'Choose Item'. Browse for the DatePicker.dll. Add it and you just need to drag drop it on your aspx pages.

Background

I am very thankful to Epoch Calendar for providing javascript & css files. You can refer to it at http://www.javascriptkit.com/script/script2/epoch/index.shtml.

Using the code 

Just go to toolbox. In general section click on 'Choose Item'. Browse for the DatePicker.dll. Add it and you just need to drag drop it on your aspx pages. its reference will be added to Bin by itself. Now you can see a simple textbox in which if you click, you will see a calendar will pop-out.

Just small code segment needs to be added in the aspx page. We need to create a new instance of the calendar. Code snippet is shown as follows. Just add it to the head section of the aspx page or after the page header if you are using usercontrol.

 <script language="javascript" type="text/javascript">
  var calendar1;
  /*must be declared in global scope*/
  /*put the calendar initializations in the window's onload() method*/
  window.onload = function() {
  calendar1 = new Epoch('calendar1','popup',document.getElementById('DatePicker1'),false);
    return;
  }
  </script>
		 

Remember that this method will be called on Onload & this should remain intact as it is otherwise the calendar will not work. You can also do it by adding attributes in code behind.  

Points of Interest

There are lots of other useful custom control which we can make. These controls increases the re usability & save our time to code. Also any change can be made separately and after that the dll can be placed in any project.

History 

Before creating this custom control, user had to place javascript file, css file etc in there project explicitly. If any of these file(s) missed, then our pages shows error(s). Now this problem will not be faced any more.

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)