/    Sign up×
Community /Pin to ProfileBookmark

pop up calendar

hi,

I wanna incorporate the pop up calendar in my html page.

i have three textboxes,beside it i have three individual calendar icons. when i click the icon the calendar should pop up and the selected date should go into appropriate text box.

please help

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@Warren86Mar 23.2005 — Maybe you will find the following to be a useful guide.

-------- Main Document ----------------

<HTML>

<Head>

<Script Language=JavaScript>

var calendarWindow = "";
var DateStr = "";

function GetDayofWk(){

DateStr = calendarWindow.document.Calendar.value;
temp = new String(DateStr);
startSlice = temp.indexOf(' ');
DayofWk = temp.substring(startSlice-3,startSlice);
return DayofWk;
}

function GetMonthNmbr(){

tmpStr = calendarWindow.document.Calendar.month;
return tmpStr;
}

function GetDayNmbr(){

tmpStr = calendarWindow.document.Calendar.day;
return tmpStr;
}

function GetYear(){

tmpStr = calendarWindow.document.Calendar.year;
return tmpStr;
}

function refreshInfo() {

nWkday = GetDayofWk();
xMonth = GetMonthNmbr();
xDay = GetDayNmbr();
xYear = GetYear();
dateStr = xMonth+"/"+xDay+"/"+xYear;
Form1.selectedDate.value = dateStr;
Form1.dayName.value = nWkday;
closeCalendar();
}

function openCalendar(){

if (calendarWindow != ""){calendarWindow.close();}
calendarWindow =window.open("popCalendar.html","calWin","toolbar=0,scrollbars=0,statusbar=0,height=220,width=390,top=50,left=380");
calendarWindow.document.title = "Calendar";
}

function closeCalendar(){

if (calendarWindow != ""){calendarWindow.close()}
}

window.onunload=closeCalendar;


</Script>

</Head>

<Body>

<br><br>

<Form name='Form1'>

<Table cellspacing=0 cellpadding=3 style='border:solid black 1px;Font-Size:12pt;Font-Weight:Bold;width:240px;background-color:lightyellow'>

<THead><TH bgcolor='lightBlue'>This is a Title</TH></THead>

<TR><TD align='center'>Selected Date:<input type=text size=12 value="" name='selectedDate' readonly></TR></TD>

<TR><TD align='center'>Day of Week: <input type=text size=12 value="" name='dayName' readonly></TR></TD>

<TR><TD align='center' style='border-top:solid darkgoldenrod 4px'><input type=button value='Display Calendar' onclick="openCalendar()" style='background-color:lightskyblue;Font-Family:Veranda;Font-Size:11pt'></TR></TD>

</Table>

</Form>

</HTML>

-------------- PopCalendar.html ---------------

<HTML>

<Head>

<Script Language=VBScript>

Sub Calendar_Click()

opener.refreshInfo()

end sub

</Script>

</Head>

<Body>

<object classid='clsid:8E27C92B-1264-101C-8A2F-040224009C02' ID='Calendar' width='370' height='200'></object>

</Body>

</HTML>
×

Success!

Help @santhosh spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.6,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...