Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
New Developer
incarnis
Posts: 20
Registered: ‎02-18-2009
My Device: Not Specified

Javascript problems

Hi

 

I have a couple of problems with JavaScript.

 

First, I have this in the <head>:

 

<script type="text/javascript" src="common/datetimepicker.js"></script>

...and a link that looks like this:

 

<a href="javascript&colonPopupCalendar('eta','ddmmyyyy',true,15)"> Click here to enter a date and time of arrival using the calendar popup. </a>

...but when I click on the link, absolutely nothing happens. Looking at the source with ALT-RBVS shows no sign of the <script> section.

 

Also, I have an a:hover style defined in my css which is supposed to make the link red when hovered over. This works fine on every browser except for the BlackBerry. Of course, I can't check what the style actually is because the BB browser mysteriously replaces all my style sections with:

 

 

<style type="application/vnd.rim.css" src="InternedData0"> </style>

 

 

My setup is Blackberry 9000 v4.6.0.162 (Platform 4.0.0.155)

 

Help!

 

 

 

 

 

 

Please use plain text.
Guru I
Xandrex
Posts: 18,377
Registered: ‎07-29-2008
My Device: Z10 10.1.0.2312 / Playbook 2.1 / 8900 5.0
My Carrier: Vodafone France (SFR) & B&You

Re: Javascript problems

can you publish the webpage somewhere so that we can look ?



The search box on top-right of this page is your true friend, and the public Knowledge Base too:
Please use plain text.
New Developer
incarnis
Posts: 20
Registered: ‎02-18-2009
My Device: Not Specified

Re: Javascript problems

Sorry - I work on secure internal systems related to UK police force and can't give access to sites or publish more than code snippets. Pain in the ass, I know...:smileywink:
Please use plain text.
New Developer
incarnis
Posts: 20
Registered: ‎02-18-2009
My Device: Not Specified

Re: Javascript problems

Ah, OK, well I have sort of solved one of my problems but got another.

 

If I move the <script> tags out of the head into the body, the BB can run the script, but I get the message:

 

"JavaScript&colon A script has requested that a new URL be loaded. Do you wish to load?"

 

I have enabled JavaScript popups but this doesn't stop the message appearing. This will be a real pain if you have to OK it every time!

Please use plain text.
BlackBerry Development Advisor
tneil
Posts: 3,708
Registered: ‎10-16-2008
My Device: Z10
My Carrier: Rogers

Re: Javascript problems

[ Edited ]

Have you tried the following:

 

 

<a href="" onclick="PopupCalendar('eta','ddmmyyyy',true,15)">
       Click here to enter a date and time of arrival using the calendar popup.
      </a>

 It may be preventing you from running javascript on a URL/href to prevent cross site scripting attacks. 
Message Edited by tneil on 02-27-2009 11:31 PM
Tim Neil
Director, Application Platform & Tools Product Management
Follow me on Twitter
Please use plain text.
New Developer
incarnis
Posts: 20
Registered: ‎02-18-2009
My Device: Not Specified

Re: Javascript problems

Thanks...using the OnClick event does indeed get around this. However, I am left with two problems now:

 

1. On my device the hover does not work on links (I should have a style which makes links highlight in red when hovered over). However, on a colleague's device, it does.

 

Our two devices are the Bold and the Curve...I forget which is which. Mine has the wider screen..:smileywink:

 

2. A new problem - the calendar popup closes itself straight away before I have a chance to select a date and time.

 

Popup code is:

 

 

//Javascript name: My Date Time Picker //Date created: 16-Nov-2003 23:19 //Scripter: TengYong Ng //Website: http://www.rainforestnet.com //Copyright (c) 2003 TengYong Ng //FileName: DateTimePicker.js //Version: 0.8 //Contact: contact@rainforestnet.com // Note: Permission given to use this script in ANY kind of applications if // header lines are left unchanged. //Global variables var winCal; var dtToday=new Date(); var Cal; var docCal; var MonthName=["January", "February", "March", "April", "May", "June","July", "August", "September", "October", "November", "December"]; var WeekDayName=["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]; var exDateTime;//Existing Date and Time //Configurable parameters var cnTop="200";//top coordinate of calendar window. var cnLeft="500";//left coordinate of calendar window var WindowTitle ="DateTime Picker";//Date Time Picker title. var WeekChar=2;//number of character for week day. if 2 then Mo,Tu,We. if 3 then Mon,Tue,Wed. var CellWidth=20;//Width of day cell. var DateSeparator="-";//Date Separator, you can change it to "/" if you want. var TimeMode=24;//default TimeMode value. 12 or 24 var ShowLongMonth=true;//Show long month name in Calendar header. example: "January". var ShowMonthYear=true;//Show Month and Year in Calendar header. var MonthYearColor="#cc0033";//Font Color of Month and Year in Calendar header. var WeekHeadColor="#0099CC";//Background Color in Week header. var SundayColor="#6699FF";//Background color of Sunday. var SaturdayColor="#CCCCFF";//Background color of Saturday. var WeekDayColor="white";//Background color of weekdays. var FontColor="blue";//color of font in Calendar day cell. var TodayColor="#FFFF33";//Background color of today. var SelDateColor="#FFFF99";//Backgrond color of selected date in textbox. var YrSelColor="#cc0033";//color of font of Year selector. var ThemeBg="";//Background image of Calendar window. //end Configurable parameters //end Global variable function PopupCalendar(pCtrl,pFormat,pShowTime,pTimeMode) { Cal=new Calendar(dtToday); if ((pShowTime!=null) && (pShowTime)) { Cal.ShowTime=true; if ((pTimeMode!=null) &&((pTimeMode=='12')||(pTimeMode=='24'))) { TimeMode=pTimeMode; } } if (pCtrl!=null) Cal.Ctrl=pCtrl; if (pFormat!=null) Cal.Format=pFormat.toUpperCase(); exDateTime=document.getElementById(pCtrl).value; if (exDateTime!="")//Parse Date String { var Sp1;//Index of Date Separator 1 var Sp2;//Index of Date Separator 2 var tSp1;//Index of Time Separator 1 var tSp1;//Index of Time Separator 2 var strMonth; var strDate; var strYear; var intMonth; var YearPattern; var strHour; var strMinute; //parse month Sp1=exDateTime.indexOf(DateSeparator,0) Sp2=exDateTime.indexOf(DateSeparator,(parseInt(Sp1)+1)); if ((Cal.Format.toUpperCase()=="DDMMYYYY") || (Cal.Format.toUpperCase()=="DDMMMYYYY")) { strMonth=exDateTime.substring(Sp1+1,Sp2); strDate=exDateTime.substring(0,Sp1); } else if ((Cal.Format.toUpperCase()=="MMDDYYYY") || (Cal.Format.toUpperCase()=="MMMDDYYYY")) { strMonth=exDateTime.substring(0,Sp1); strDate=exDateTime.substring(Sp1+1,Sp2); } if (isNaN(strMonth)) intMonth=Cal.GetMonthIndex(strMonth); else intMonth=parseInt(strMonth,10)-1; if ((parseInt(intMonth,10)>=0) && (parseInt(intMonth,10)<12)) Cal.Month=intMonth; //end parse month //parse Date if ((parseInt(strDate,10)<=Cal.GetMonDays()) && (parseInt(strDate,10)>=1)) Cal.Date=strDate; //end parse Date //parse year strYear=exDateTime.substring(Sp2+1,Sp2+5); YearPattern=/^\d{4}$/; if (YearPattern.test(strYear)) Cal.Year=parseInt(strYear,10); //end parse year //parse time if (Cal.ShowTime==true) { tSp1=exDateTime.indexOf(":",0) tSp2=exDateTime.indexOf(":",(parseInt(tSp1)+1)); strHour=exDateTime.substring(tSp1,(tSp1)-2); Cal.SetHour(strHour); strMinute=exDateTime.substring(tSp1+1,tSp2); Cal.SetMinute(strMinute); } } winCal=window.open("","DateTimePicker","toolbar=0,status=0,menubar=0,fullscreen=no,width=195,height=245,resizable=0,top="+cnTop+",left="+cnLeft); docCal=winCal.document; RenderCal(); } function RenderCal() { var vCalHeader; var vCalData; var vCalTime; var i; var j; var SelectStr; var vDayCount=0; var vFirstDay; docCal.open(); docCal.writeln("<html><head><title>"+WindowTitle+"</title>"); docCal.writeln("<script>var winMain=window.opener;</script>"); docCal.writeln("</head><body background='"+ThemeBg+"' link="+FontColor+" vlink="+FontColor+"><form name='Calendar'>"); vCalHeader="<table border=1 cellpadding=1 cellspacing=1 width='100%' align=\"center\" valign=\"top\">\n"; //Month Selector vCalHeader+="<tr>\n<td colspan='7'><table border=0 width='100%' cellpadding=0 cellspacing=0><tr><td align='left'>\n"; vCalHeader+="<select name=\"MonthSelector\" onChange=\"javascript&colonwinMain.Cal.SwitchMth(this.selectedIndex);winMain.RenderCal();\">\n"; for (i=0;i<12;i++) { if (i==Cal.Month) SelectStr="Selected"; else SelectStr=""; vCalHeader+="<option "+SelectStr+" value >"+MonthName[i]+"\n"; } vCalHeader+="</select></td>"; //Year selector vCalHeader+="\n<td align='right'><a href=\"javascript&colonwinMain.Cal.DecYear();winMain.RenderCal()\"><b><font face=\"Arial\" color=\""+YrSelColor+"\"><</font></b></a><font face=\"Arial\" color=\""+YrSelColor+"\" size=2><b> "+Cal.Year+" </b></font><a href=\"javascript&colonwinMain.Cal.IncYear();winMain.RenderCal()\"><b><font face=\"Arial\" color=\""+YrSelColor+"\">></font></b></a></td></tr></table></td>\n"; vCalHeader+="</tr>"; //Calendar header shows Month and Year if (ShowMonthYear) vCalHeader+="<tr><td colspan='7'><font face='Arial' size='2' align='center' color='"+MonthYearColor+"'><b>"+Cal.GetMonthName(ShowLongMonth)+" "+Cal.Year+"</b></font></td></tr>\n"; //Week day header vCalHeader+="<tr bgcolor="+WeekHeadColor+">"; for (i=0;i<7;i++) { vCalHeader+="<td align='center'><font face='Arial' size='2'>"+WeekDayName[i].substr(0,WeekChar)+"</font></td>"; } vCalHeader+="</tr>"; docCal.write(vCalHeader); //Calendar detail CalDate=new Date(Cal.Year,Cal.Month); CalDate.setDate(1); vFirstDay=CalDate.getDay(); vCalData="<tr>"; for (i=0;i<vFirstDay;i++) { vCalData=vCalData+GenCell(); vDayCount=vDayCount+1; } for (j=1;j<=Cal.GetMonDays();j++) { var strCell; vDayCount=vDayCount+1; if ((j==dtToday.getDate())&&(Cal.Month==dtToday.getMonth())&&(Cal.Year==dtToday.getFullYear())) strCell=GenCell(j,true,TodayColor);//Highlight today's date else { if (j==Cal.Date) { strCell=GenCell(j,true,SelDateColor); } else { if (vDayCount%7==0) strCell=GenCell(j,false,SaturdayColor); else if ((vDayCount+6)%7==0) strCell=GenCell(j,false,SundayColor); else strCell=GenCell(j,null,WeekDayColor); } } vCalData=vCalData+strCell; if((vDayCount%7==0)&&(j<Cal.GetMonDays())) { vCalData=vCalData+"</tr>\n<tr>"; } } docCal.writeln(vCalData); //Time picker if (Cal.ShowTime) { var showHour; showHour=Cal.getShowHour(); vCalTime="<tr>\n<td colspan='7' align='center'>"; vCalTime+="<input type='text' name='hour' maxlength=2 size=1 style=\"WIDTH: 22px\" value="+showHour+" onchange=\"javascript&colonwinMain.Cal.SetHour(this.value)\">"; vCalTime+=" : "; vCalTime+="<input type='text' name='minute' maxlength=2 size=1 style=\"WIDTH: 22px\" value="+Cal.Minutes+" onchange=\"javascript&colonwinMain.Cal.SetMinute(this.value)\">"; if (TimeMode==12) { var SelectAm =(parseInt(Cal.Hours,10)<12)? "Selected":""; var SelectPm =(parseInt(Cal.Hours,10)>=12)? "Selected":""; vCalTime+="<select name=\"ampm\" onchange=\"javascript&colonwinMain.Cal.SetAmPm(this.options[this.selectedIndex].value);\">"; vCalTime+="<option "+SelectAm+" value=\"AM\">AM</option>"; vCalTime+="<option "+SelectPm+" value=\"PM\">PM<option>"; vCalTime+="</select>"; } vCalTime+="\n</td>\n</tr>"; docCal.write(vCalTime); } //end time picker docCal.writeln("\n</table>"); docCal.writeln("</form></body></html>"); docCal.close(); } function GenCell(pValue,pHighLight,pColor)//Generate table cell with value { var PValue; var PCellStr; var vColor; var vHLstr1;//HighLight string var vHlstr2; var vTimeStr; if (pValue==null) PValue=""; else PValue=pValue; if (pColor!=null) vColor="bgcolor=\""+pColor+"\""; else vColor=""; if ((pHighLight!=null)&&(pHighLight)) {vHLstr1="color='red'><b>";vHLstr2="</b>";} else {vHLstr1=">";vHLstr2="";} if (Cal.ShowTime) { vTimeStr="winMain.document.getElementById('"+Cal.Ctrl+"').value+=' '+"+"winMain.Cal.getShowHour()"+"+':'+"+"winMain.Cal.Minutes"; if (TimeMode==12) vTimeStr+="+' '+winMain.Cal.AMorPM"; } else vTimeStr=""; PCellStr="<td "+vColor+" width="+CellWidth+" align='center'><font face='verdana' size='2'"+vHLstr1+"<a href=\"javascript&colonwinMain.document.getElementById('"+Cal.Ctrl+"').value='"+Cal.FormatDate(PValue)+"';"+vTimeStr+";window.close();\">"+PValue+"</a>"+vHLstr2+"</font></td>"; return PCellStr; } function Calendar(pDate,pCtrl) { //Properties this.Date=pDate.getDate();//selected date this.Month=pDate.getMonth();//selected month number this.Year=pDate.getFullYear();//selected year in 4 digits this.Hours=pDate.getHours(); if (pDate.getMinutes()<10) this.Minutes="0"+pDate.getMinutes(); else this.Minutes=pDate.getMinutes(); this.MyWindow=winCal; this.Ctrl=pCtrl; this.Format="ddMMyyyy"; this.Separator=DateSeparator; this.ShowTime=false; if (pDate.getHours()<12) this.AMorPM="AM"; else this.AMorPM="PM"; } function GetMonthIndex(shortMonthName) { for (i=0;i<12;i++) { if (MonthName[i].substring(0,3).toUpperCase()==shortMonthName.toUpperCase()) { return i;} } } Calendar.prototype.GetMonthIndex=GetMonthIndex; function IncYear() { Cal.Year++;} Calendar.prototype.IncYear=IncYear; function DecYear() { Cal.Year--;} Calendar.prototype.DecYear=DecYear; function SwitchMth(intMth) { Cal.Month=intMth;} Calendar.prototype.SwitchMth=SwitchMth; function SetHour(intHour) { var MaxHour; var MinHour; if (TimeMode==24) { MaxHour=23;MinHour=0} else if (TimeMode==12) { MaxHour=12;MinHour=1} else alert("TimeMode can only be 12 or 24"); var HourExp=new RegExp("^\\d\\d$"); if (HourExp.test(intHour) && (parseInt(intHour,10)<=MaxHour) && (parseInt(intHour,10)>=MinHour)) { if ((TimeMode==12) && (Cal.AMorPM=="PM")) { if (parseInt(intHour,10)==12) Cal.Hours=12; else Cal.Hours=parseInt(intHour,10)+12; } else if ((TimeMode==12) && (Cal.AMorPM=="AM")) { if (intHour==12) intHour-=12; Cal.Hours=parseInt(intHour,10); } else if (TimeMode==24) Cal.Hours=parseInt(intHour,10); } } Calendar.prototype.SetHour=SetHour; function SetMinute(intMin) { var MinExp=new RegExp("^\\d\\d$"); if (MinExp.test(intMin) && (intMin<60)) Cal.Minutes=intMin; } Calendar.prototype.SetMinute=SetMinute; function SetAmPm(pvalue) { this.AMorPM=pvalue; if (pvalue=="PM") { this.Hours=(parseInt(this.Hours,10))+12; if (this.Hours==24) this.Hours=12; } else if (pvalue=="AM") this.Hours-=12; } Calendar.prototype.SetAmPm=SetAmPm; function getShowHour() { var finalHour; if (TimeMode==12) { if (parseInt(this.Hours,10)==0) { this.AMorPM="AM"; finalHour=parseInt(this.Hours,10)+12; } else if (parseInt(this.Hours,10)==12) { this.AMorPM="PM"; finalHour=12; } else if (this.Hours>12) { this.AMorPM="PM"; if ((this.Hours-12)<10) finalHour="0"+((parseInt(this.Hours,10))-12); else finalHour=parseInt(this.Hours,10)-12; } else { this.AMorPM="AM"; if (this.Hours<10) finalHour="0"+parseInt(this.Hours,10); else finalHour=this.Hours; } } else if (TimeMode==24) { if (this.Hours<10) finalHour="0"+parseInt(this.Hours,10); else finalHour=this.Hours; } return finalHour; } Calendar.prototype.getShowHour=getShowHour; function GetMonthName(IsLong) { var Month=MonthName[this.Month]; if (IsLong) return Month; else return Month.substr(0,3); } Calendar.prototype.GetMonthName=GetMonthName; function GetMonDays()//Get number of days in a month { var DaysInMonth=[31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; if (this.IsLeapYear()) { DaysInMonth[1]=29; } return DaysInMonth[this.Month]; } Calendar.prototype.GetMonDays=GetMonDays; function IsLeapYear() { if ((this.Year%4)==0) { if ((this.Year%100==0) && (this.Year%400)!=0) { return false; } else { return true; } } else { return false; } } Calendar.prototype.IsLeapYear=IsLeapYear; function FormatDate(pDate) { if (this.Format.toUpperCase()=="DDMMYYYY") return (pDate+DateSeparator+(this.Month+1)+DateSeparator+this.Year); else if (this.Format.toUpperCase()=="DDMMMYYYY") return (pDate+DateSeparator+this.GetMonthName(false)+DateSeparator+this.Year); else if (this.Format.toUpperCase()=="MMDDYYYY") return ((this.Month+1)+DateSeparator+pDate+DateSeparator+this.Year); else if (this.Format.toUpperCase()=="MMMDDYYYY") return (this.GetMonthName(false)+DateSeparator+pDate+DateSeparator+this.Year); } Calendar.prototype.FormatDate=FormatDate;

 

 

 

Please use plain text.
New Developer
incarnis
Posts: 20
Registered: ‎02-18-2009
My Device: Not Specified

Re: Javascript problems

I also regularly get "a problem occurred while trying to render this page". A reload gets past the error.
Please use plain text.
New Developer
rajnarayan
Posts: 6
Registered: ‎08-13-2009
My Device: Not Specified

Re: Javascript problems

Hi

 

Is this program works fine in the Blackberry Browser without any issue?

 

Regards

Raj 

Please use plain text.