...

View Full Version : script not working on Firefox



arturex
02-17-2007, 11:33 AM
The folowing script from RuaJava.com works perfect on IE but under Firefox show a incorrect current year and table month days are empty.
Pls give me a help. thanks

<!-- Begin
var now = new Date();
var month_array = new Array("Janeiro","Fevereiro","Mar&ccedil;o","Abril","Maio","Junho","Julho","Agosto","Setembro","Outubro","Novembro","Dezembro");
document.write("<form name=date_list><table bgcolor=silver><tr><td>");
document.write("<select name=month onchange=change_month(this.options.selectedIndex)>");
for(i=0;i<month_array.length;i++)
{
if (now.getMonth() != i)
{document.write ("<option value="+i+">"+month_array[i]);}
else
{document.write ("<option value="+i+" selected>"+month_array[i]);}

}
document.write("</select>");
document.write("</td><td>");
document.write ("<select name=year onchange=change_year(this.options[this.options.selectedIndex])>");
for(i=1950;i<3000;i++)
{
if (now.getYear() != i)
{document.write("<option value="+i+">"+i);}
else
{document.write("<option value="+i+" selected>"+i);}
}
document.write("</select></td></tr><tr><td colspan=2><center>");

document.write("<table bgcolor=white border=0 cellspacing = 0 cellpading = 0 width=100%><tr bgcolor=gray align=center>");
document.write("<td><font color=silver>S</font></td><td><font color=silver>T</td><td><font color=silver>Q</td><td><font color=silver>Q</td><td><font color=silver>S</td><td ><font color=silver>S</td><td ><font color=silver>D</td>");
document.write("</tr><tr>");
for(j=0;j<6;j++)
{
for(i=0;i<7;i++)
{
document.write("<td align=center id=d"+i+"r"+j+"></td>")
}
document.write("</tr>");
}

document.write("</table>");

document.write("</center></from></td></tr></table>");

var show_date = new Date();

function set_cal(show_date)
{
begin_day = new Date (show_date.getYear(),show_date.getMonth(),1);
begin_day_date = begin_day.getDay();
end_day = new Date (show_date.getYear(),show_date.getMonth()+1,1);
count_day = (end_day - begin_day)/1000/60/60/24;
count_day = Math.round(count_day);
input_table(begin_day_date,count_day);
}
set_cal(show_date);

function input_table(begin,count)
{
init();
j=0;
if (begin!=0){i=begin-1;}else{i=6}
for (c=1;c<count+1;c++)
{
colum_name = eval("d"+i+"r"+j);
if ((now.getDate() == c)&&(show_date.getMonth() == now.getMonth())&&(show_date.getYear() == now.getYear())) {colum_name.style.backgroundColor = "white";colum_name.style.color = "red";};
colum_name.innerText = c;
i++;
if (i==7){i=0;j++;}
}
}

function init()
{
for(j=0;j<6;j++)
{
for(i=0;i<7;i++)
{
colum_name = eval("d"+i+"r"+j);
colum_name.innerText = "-";
colum_name.style.backgroundColor ="";
colum_name.style.color ="";
}
}
}

function change_month(sel_month)
{
show_date = new Date(show_date.getYear(),sel_month,1);
set_cal(show_date);
}

function change_year(sel_year)
{
sel_year = sel_year.value;
show_date = new Date(sel_year,show_date.getMonth(),1);
set_cal(show_date);
}
// End -->

vwphillips
02-17-2007, 12:06 PM
try
now.getFullYear()

arturex
02-17-2007, 12:30 PM
Thanks Vic
Wrong year is corrected by now.getFullYear, but the table days still missing...

vwphillips
02-17-2007, 02:22 PM
document.write is awful and depreciated.

it takes time for the browser to recognise elements exist
with this script everthing takes place as the page is loaded.

in mozilla the column ids are not recognised.

if I use the DOM

mozilla recognises the elements(3 out of 4 loads) but IE does not.

also

while tables are convenient they are no longer recommended for this type of application.

The script needs a complete rewrite.

However the Math looks OK

There are many calender scripts available.
suggest you find a modern one that does not use document.write or tables

I have a number on my site below

If you cant find one you like I may be willing to rewrite this one, mainly to fully verify the math

also do you need one that can format both dd/mm/yyyy and mm/dd/yyyy.

vwphillips
02-17-2007, 10:10 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--

var zxcMonthAry=new Array('Janeiro','Fevereiro','Mar&ccedil;o','Abril','Maio','Junho','Julho','Agosto','Setembro','Outub ro','Novembro','Dezembro');
var zxcMonthAry=new Array('January','February','March','April','May','June','July','August','Setember','October','Novemb er','December');
var zxcDayAry=['S','T','Q','Q','S','S','D'];
var zxcDayAry=['M','T','W','T','F','S','S'];
var zxcFormat='mm/mm/yy';

var zxcToDay=new Date();

function zxcInitCalendar(){
zxcFormat=(zxcFormat.charAt(0).toLowerCase()=='m')?6:0;
zxcDayAry=zxcDayAry.concat(zxcDayAry);
var zxcobj=document.getElementById('tst')
var zxcobj=zxcES('DIV',{position:'relative',overflow:'hidden',left:(0)+'px',top:(0)+'px',width:(20*7+6)+ 'px',height:(20*7+30)+'px',backgroundColor:'#FFFFCC',border:'solid black 1px'},zxcobj);
var zxcdiv=zxcES('DIV',{position:'absolute',overflow:'hidden',left:(2)+'px',top:(25)+'px',width:(20*7)+' px',height:(20*7)+'px',backgroundColor:'#FFFFCC',border:'solid black 1px'},zxcobj);
for (var zxc4=0;zxc4<49;zxc4++){
zxcES('DIV',{position:'absolute',overflow:'hidden',left:((zxc4%7)*20)+'px',top:(Math.floor(zxc4/7)*20)+'px',width:'20px',height:'20px',color:(zxc4>6)?'#000000':'#DADADA',fontSize:'16px',backgroundColor:(zxc4>6)?'#FFFFCC':'#494949',textAlign:'center',border:'solid black 0px'},zxcdiv,(zxc4>6)?'#':zxcDayAry[zxc4+zxcFormat]);
}
var zxcsel=zxcES('SELECT',{position:'absolute',left:'4px',top:'2px',fontSize:'12px'},zxcobj);
zxcsel.onchange=zxcSelCng;
for (var zxc0=0;zxc0<zxcMonthAry.length;zxc0++){
zxcsel.options[zxc0]=new Option(zxcMonthAry[zxc0],zxc0,true,true);
}
var zxcsel=zxcES(zxcsel.cloneNode(false),{},zxcobj);
zxcsel.onchange=zxcSelCng;
for (var zxc1=1950;zxc1<3000;zxc1++){
zxcsel.options[zxc1-1950]=new Option(zxc1,zxc1,true,true);
}
zxcES(zxcsel,{left:((20*7)+2-zxcsel.offsetWidth)+'px'});
zxcFormat=(zxcFormat==6)?0:1;
zxcCngDate(zxcToDay);
}

function zxcCngDate(zxcdate){
var zxcm=zxcdate.getMonth();
var zxcy=zxcdate.getFullYear();
zxcCalObjs()[1].selectedIndex=zxcm;
zxcCalObjs()[2].selectedIndex=zxcy-1950;
zxcfirstday=new Date(zxcy,zxcm,1).getDay();
zxcdaysinmonth=new Date(zxcy,zxcm+1,1,-1).getDate();
zxcfirstday=(zxcfirstday-zxcFormat<0)?6:zxcfirstday-zxcFormat;
zxcClearDates();
var zxcdivs=zxcCalObjs()[0];
for (var zxc0=7;zxc0<zxcdaysinmonth+7;zxc0++){
zxcdivs[zxc0+zxcfirstday].firstChild.data=zxc0-6;
if (zxc0-6-zxcfirstday==zxcdate.getDate()&&zxcToDay.getFullYear()==zxcy&&zxcToDay.getMonth()==zxcm){
zxcdivs[zxc0].style.color='#ff0000';
}
}
}

function zxcClearDates(){
var zxcdivs=zxcCalObjs()[0];
for (var zxc0=7;zxc0<49;zxc0++){
zxcdivs[zxc0].firstChild.data='-';
zxcdivs[zxc0].style.color='#000000';
}
}

function zxcSelCng(){
zxcCngDate(new Date(zxcCalObjs()[2].value,zxcCalObjs()[1].value,1));
}

function zxcCalObjs(){
var zxcdiv=document.getElementById('tst');
var zxcsels=zxcdiv.getElementsByTagName('SELECT');
return [zxcdiv.firstChild.firstChild.getElementsByTagName('DIV'),zxcsels[0],zxcsels[1]];
}

function zxcES(zxcele,zxcstyle,zxcp,zxctxt){
if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
if (zxcp){ zxcp.appendChild(zxcele); }
if (zxctxt){ zxcele.appendChild(document.createTextNode(zxctxt)); }
return zxcele;
}


// End -->
</script>

</head>

<body onload="zxcInitCalendar();">
<div id="tst" ></div>
<br>

</body>


</html>

Kor
02-18-2007, 08:00 AM
To arturex:

innerText method is IE only. This was the reason for you calendar woun't work. You could have used innerHTML instead. Or DOM methods.

But vwphillips is right about document.write() method..

vwphillips
02-18-2007, 12:01 PM
BTW arturex

the original code had some IE only methods

which of couse I changed before trying the DOM

but am reasonable sure its a document write problem in mozzila

also I simplified the Math and note the reduction in code using the methods I suggested as opposed to tables.

also what is the calendar for as it may need a little more work if you want to extract the selected date this for form inputs.

arturex
02-18-2007, 03:44 PM
Thank you Vic.
The calender is just for visualization and consulting. I notice a small problem:
when you play back and forward with months and return to the current month the current day is not showed up correctly - a refresh is need to correct the situation.
Thanks again

vwphillips
02-18-2007, 04:16 PM
opps


function zxcSelCng(){
zxcCngDate(new Date(zxcCalObjs()[2].value,zxcCalObjs()[1].value,zxcToDay.getDate()));
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum