Hi,
I have a requirement where I need a facility for user which lets him select multiple dates by displaying a calendar (similar to what appears for date field), for a web application.
I have tried a funcionality with a javascript code but that doesnot allow multiple selection.
Any help, already build tool refrence would be helpful.
Thanks
Subject: Need Date selector in web for multiple selection
That’s not a Domino-specific question – lot’s of folks need a web calendar widget. Google, then, becomes your bestest friend:
Subject: RE: Need Date selector in web for multiple selection
Hi Stan,Thanks for the response, but actually I am looking for domino specific code only, need to captre the value in a multi value date field.
Struggling with follwoing code to change it to multiple value selection.
All this is pass through javascript in a subform which is inserted on form, and calling a main function opencalendar which takes the value of the target field.
function opencalendar(temptargetfield) {
var field= eval(“document.forms[0].” + temptargetfield);
targetfield = “opener.document.forms[0].” + temptargetfield + “.value”;
var mydate;
if(field.value == “” || field.value.length < 10 || field.value.length >10)
{
mydate = new Date();
}
else
{
var tempday = field.value.charAt(3).toString() + field.value.charAt(4).toString();//suganya
var tempmonth= (parseInt((parsemonth(field.value.charAt(0).toString(), field.value.charAt(1).toString())))-1).toString();//suganya
var tempyear = (parseInt(field.value.charAt(6).toString() + field.value.charAt(7).toString() + field.value.charAt(8).toString() + field.value.charAt(9).toString())).toString();
mydate = new Date(tempyear, tempmonth, tempday );
}
for(var i=0;i<=monthA.length;i++)
{
if (mydate.getMonth() == i)
{
month = i+1;
}
}
year = mydate.getYear();
//yearA[4].toString();
if(!calwin || calwin.closed )
{
calwin = window.open("","calwin","resizable =no, status =no,height=275,width=210,left=20,top=20");
calccal(calwin,month,year,targetfield);
}
else
{
calwin.focus()
}
}
function calccal(targetwin,month,year,targetfield) {
var endday = calclastday(eval(month),eval(year));
mystr = month + “/01/” + year;
mydate = new Date(mystr);
firstday = mydate.getDay();
var cnt = 0;
var day = new Array(6);
for (var i=0; i<6; i++)
day[i] = new Array(7);
for (var r=0; r<6; r++)
{
for (var c=0; c<7; c++)
{
if ((cnt==0) && (c!=firstday))
continue;
cnt++;
day[r][c] = cnt;
if (cnt==endday)
break;
}
if (cnt==endday)
break;
}
// this is the place where u give title to the window
targetwin.document.write(“Date Picker<BODY body onBlur="self.focus()">
”);var prevyear = eval(year) - 1;
targetwin.document.write(“
");var prevmonth = calcprevmonth(month);
var prevmonthyear = calcprevyear(month,year);
// this is the place where u can change the color of the button and the text on // the button
// style =‘background : #006898; color= #ffffff’
targetwin.document.write(“
");targetwin.document.write(“
”);var nextmonth = calcnextmonth(month);
var nextmonthyear = calcnextyear(month,year);
// this is the place where u can change the color of the button and the text on
// the button
// style =‘background : #006898; color= #ffffff’
targetwin.document.write(“
");var nextyear = eval(year) + 1;
// this is the place where u can change the color of the button and the text on
// the button
// style =‘background : #006898; color= #ffffff’
targetwin.document.write(“
");targetwin.document.write(“
”);targetwin.document.write(“
”);targetwin.document.write(“
”);targetwin.document.write(“
”);targetwin.document.write(“
”);targetwin.document.write(“
”);targetwin.document.write(“
”);targetwin.document.write(“
”);targetwin.document.write(“
”);targetwin.document.write(“
”);var selectedmonth = eval(month) - 1;
var today = new Date();
var thisyear = today.getYear();
var selectedyear = eval(year) - thisyear + 4;
var conditionalpadder = “”;
for(r=0; r<6; r++)
{
targetwin.document.write(“
”);for(c=0; c<7; c++)
{
targetwin.document.write("<TD>");
if(day[r][c] != null) {
if (day[r][c] < 10)
conditionalpadder = " "
else
conditionalpadder = "";
// this is the place where u can change the color of the button and the text on
// the button
// style = ‘background : #006898; color= #ffffff’
// to highlight the current date give the reverse color
// style = ‘background : #ffffff; color= #006898’
var selDay;
var selMon;
if((day[r][c]).toString().length < 2) { selDay= “0”+(day[r][c]).toString();} else{ selDay=(day[r][c]).toString();}
if ((selectedmonth+1).toString().length<2)
{selMon=“0”+(selectedmonth+1).toString(); }
else
{selMon= (selectedmonth+1).toString();}
var seldate=selMon+“/”+selDay+“/”+yearA[selectedyear.toString()];
//var frDate=new Date(yearA[selectedyear.toString()],selMon-1,selDay);
//var formattedDt=FormateDate(frDate,fmtStr);
if((day[r][c]).toString() == today.getDate()) //highlight todays date
{
targetwin.document.write("<INPUT TYPE=BUTTON style ='background : #ffffff; color= #006898' NAME="+day[r][c]+ " VALUE=" + conditionalpadder + day[r][c] + conditionalpadder +
" onClick=\"window.close();" +targetfield+"='"+seldate+"';\";>");
}
else
{
targetwin.document.write("<INPUT TYPE=BUTTON style ='background : #006898; color= #ffffff' NAME="+day[r][c]+ " VALUE=" + conditionalpadder + day[r][c] + conditionalpadder +
" onClick=\"window.close();" +targetfield+"='"+seldate+"';\";>");
}}
targetwin.document.write("</TD>");
}
targetwin.document.write(“
”);}
targetwin.document.write(“
| <INPUT TYPE=BUTTON style =‘background : #006898; color= #ffffff’ NAME=prevyearbutton VALUE=‘<<’”+
" onclick=‘document.close();opener.calccal(opener.calwin,“+month+”,“+prevyear+”,"“+targetfield+”")’> |
<INPUT TYPE=BUTTON style =‘background : #006898; color= #ffffff’ NAME=prevmonthbutton VALUE=’ < '”+
" onclick=‘document.close();opener.calccal(opener.calwin,“+prevmonth+”,“+prevmonthyear+”,"“+targetfield+”")’> |
”);
var index = eval(month) - 1; targetwin.document.write(“” + monthA[index] + " " + year + “ |
<INPUT TYPE=BUTTON style =‘background : #006898; color= #ffffff’ NAME=nextmonthbutton VALUE=’ > '”+
" onclick=‘document.close();opener.calccal(opener.calwin,“+nextmonth+”,“+nextmonthyear+”,"“+targetfield+”")’> |
<INPUT TYPE=BUTTON style =‘background : #006898; color= #ffffff’ NAME=nextyearbutton VALUE=‘>>’”+
" onclick=‘document.close();opener.calccal(opener.calwin,“+month+”,“+nextyear+”,"“+targetfield+”")’> |
||
| Su | Mo | Tu | We | Th | Fr | Sa |
}
Subject: RE: Need Date selector in web for multiple selection
No, you don’t need Domino-specific anything. The widget I pointed you to allows multiple date selection. The date format is configurable, the value separator is configurable, everything is configurable. Yes, it will put multiple dates in a multiple value date field. Use it. It works.