Create Multiple calender control on runtime time

Hi, If you want to create an unlimited calender control with textbox. try to my code. if you want to that user can enter multiple dates on single page as per over requirement. we can done do this using javascript. when user click on create button a texbox and calender button will be created. user can delete all control by single click on remove button.

On .aspx page

<script language="JavaScript" src="calendar.js"></script>
<link rel="stylesheet" href="calendar.css">

<form name="test">
<div id="container">
<input type="Button" onclick="f_createContent()" value="Create" />
<input type="Button" onclick="removeContent()" value="Delete" />

<script language="JavaScript">
var CALNUM = 1;
function f_createContent() {
var e_div = f_getElement('container');
e_div.innerHTML += CALNUM
+ '. <input type="text" name="testinpt' + CALNUM + '" value="" />'
+ '<img title="Open Calendar" class="tcalIcon" onclick="A_TCALS[\'CalID' + CALNUM + '\'].f_toggle()" id="tcalico_CalID' + CALNUM + '" src="img/cal.gif"/><br />';

new tcal ({
// form name
'formname': 'test',
// input name
'controlname': 'testinpt' + CALNUM,
// set unique ID to identify the elements
'id': 'CalID' + CALNUM

function removeContent() {
var e_div = f_getElement('container');
e_div.innerHTML = '';
window.A_TCALS = null;
window.A_TCALSIDX = null;


  • class file for mulitiple calender (44084-24530-class-file-mulitiple-calender.css)
  • javascript for calender (44084-24417-javascript-calender.js)
  • Comments

    No responses found. Be the first to comment...

  • Do not include your name, "with regards" etc in the comment. Write detailed comment, relevant to the topic.
  • No HTML formatting and links to other web sites are allowed.
  • This is a strictly moderated site. Absolutely no spam allowed.
  • Name: