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
rajnarayan
Posts: 6
Registered: ‎08-13-2009
My Device: Not Specified

JavaScript not working on Black Berry Simulator 8330

Iam developing a application which has to work in Blackberry Browser ,where dates to be entered,  

Date Picker javascript is not working in the Black Berry Browser.

Same date picker works fine in IE and Mozilla browsers in   my Desktops.below is the code which is used to pick the date in the HTML page ,Please suggest or guide how to proceed with this issue,below is the Javascript code

 

Regards

Raj 

 

<html>
<head>
<script language="JavaScript">
<!--
var months = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
var daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var days = new Array("S", "M", "T", "W", "T", "F", "S");

today = new getToday();
var element_id;

function getDays(month, year)
{
    // Test for leap year when February is selected.
    if (1 == month)
        return ((0 == year % 4) && (0 != (year % 100))) ||
            (0 == year % 400) ? 29 : 28;
    else
        return daysInMonth[month];
}

function getToday()
{
    // Generate today's date.
    this.now = new Date();
    this.year = this.now.getFullYear() ; // Returned year XXXX
    this.month = this.now.getMonth();
    this.day = this.now.getDate();
}


function newCalendar()
{
    var parseYear = parseInt(document.all.year  [document.all.year.selectedIndex].text);

    var newCal = new Date(parseYear , document.all.month.selectedIndex, 1);
    var day = -1;
    var startDay = newCal.getDay();
    var daily = 0;

    today = new getToday(); // 1st call
    if ((today.year == newCal.getFullYear() ) &&   (today.month == newCal.getMonth()))
       day = today.day;
    // Cache the calendar table's tBody section, dayList.
    var tableCal = document.all.calendar.tBodies.dayList;

    var intDaysInMonth =
       getDays(newCal.getMonth(), newCal.getFullYear() );

    for (var intWeek = 0; intWeek < tableCal.rows.length;  intWeek++)
           for (var intDay = 0;
             intDay < tableCal.rows[intWeek].cells.length;
             intDay++)
     {
          var cell = tableCal.rows[intWeek].cells[intDay];

          // Start counting days.
          if ((intDay == startDay) && (0 == daily))
             daily = 1;

          // Highlight the current day.
          cell.style.color = (day == daily) ? "red" : "";
          if(day == daily)
          {
                document.all.todayday.innerText= "Today: " +  day + "/" +
                    (newCal.getMonth()+1) + "/" + newCal.getFullYear() ;
          }
          // Output the day number into the cell.
          if ((daily > 0) && (daily <= intDaysInMonth))
             cell.innerText = daily++;
          else
             cell.innerText = "";
       }

}

     function getTodayDay()
     {
                document.all[element_id].value = today.day + "/" + (today.month+1) +
                    "/" + today.year;
                //document.all.calendar.style.visibility="hidden";
                document.all.calendar.style.display="none";
                document.all.year.selectedIndex =100;
                document.all.month.selectedIndex = today.month;
     }

        function getDate()
         {
            // This code executes when the user clicks on a day
            // in the calendar.
            if ("TD" == event.srcElement.tagName)
               // Test whether day is valid.
               if ("" != event.srcElement.innerText)
               {
                 var mn = document.all.month.selectedIndex+1;
                 var Year = document.all.year [document.all.year.selectedIndex].text;
                 document.all[element_id].value=event.srcElement.innerText+"/"+mn +"/"  +Year;
                 //document.all.calendar.style.visibility="hidden";
                 document.all.calendar.style.display="none";
             }
         }

function GetBodyOffsetX(el_name, shift)
{
    var x;
    var y;
    x = 0;
    y = 0;

    var elem = document.all[el_name];
    do
    {
        x += elem.offsetLeft;
        y += elem.offsetTop;
        if (elem.tagName == "BODY")
            break;
        elem = elem.offsetParent;
    } while  (1 > 0);

    shift[0] = x;
    shift[1] = y;
    return  x;
}

function SetCalendarOnElement(el_name)
{
    if (el_name=="")
    el_name = element_id;
    var shift = new Array(2);
    GetBodyOffsetX(el_name, shift);
    document.all.calendar.style.pixelLeft  = shift[0]; //  - document.all.calendar.offsetLeft;
    document.all.calendar.style.pixelTop = shift[1] + 25 ;
}



function ShowCalendar(elem_name)
{
        if (elem_name=="")
        elem_name = element_id;

        element_id    = elem_name; // element_id is global variable
        newCalendar();
        SetCalendarOnElement(element_id);
        //document.all.calendar.style.visibility = "visible";
        document.all.calendar.style.display="inline";
}

function HideCalendar()
{
    //document.all.calendar.style.visibility="hidden";
    document.all.calendar.style.display="none";
}

function toggleCalendar(elem_name)
{
    //if (document.all.calendar.style.visibility == "hidden")
    if(document.all.calendar.style.display=="none")
        ShowCalendar(elem_name);
    else
        HideCalendar();
}
-->
</script>

<style>
.today {COLOR: black; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt; FONT-WEIGHT: bold}
.days {COLOR: navy; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt; FONT-WEIGHT: bold; TEXT-ALIGN: center}
.dates {COLOR: black; FONT-FAMILY: sans-serif; FONT-SIZE: 10pt}
</style>
</head>

<body>
<FORM name=myForm>
<BR><BR><BR><BR>
<center>
<INPUT TYPE="text" NAME="MyDate" size=15>
<a href="JavaScript&colon;;" onClick="toggleCalendar('MyDate')">Calendar</a>
</center>
</form>


<TABLE bgColor=#ffffff border=1 cellPadding=0 cellSpacing=3 id=calendar style="DISPLAY: none; POSITION: absolute; Z-INDEX: 4">
  <TBODY>
  <TR>
    <TD colSpan=7 vAlign=center>
    <!-- Month combo box -->
    <SELECT id=month onchange=newCalendar()>
        <SCRIPT language=JavaScript>
        // Output months into the document.
        // Select current month.
        for (var intLoop = 0; intLoop < months.length; intLoop++)
            document.write("<OPTION " +    (today.month == intLoop ? "Selected" : "") + ">" + months[intLoop]);
        </SCRIPT>
    </SELECT>
    <!-- Year combo box -->
    <SELECT id=year onchange=newCalendar()>
        <SCRIPT language=JavaScript>
        // Output years into the document.
        // Select current year.
        for (var intLoop = 1900; intLoop < 2028; intLoop++)
            document.write("<OPTION " + (today.year == intLoop ? "Selected" : "") + ">" + intLoop);
        </SCRIPT>
    </SELECT>

    </TD>
  </TR>



  <TR class=days>
    <!-- Generate column for each day. -->
    <SCRIPT language=JavaScript>
    // Output days.
    for (var intLoop = 0; intLoop < days.length; intLoop++)
        document.write("<TD>" + days[intLoop] + "</TD>");
    </SCRIPT>
  </TR>


  <TBODY class=dates id=dayList onclick="getDate('')" vAlign=center>
  <!-- Generate grid for individual days. -->
  <SCRIPT language=JavaScript>
    for (var intWeeks = 0; intWeeks < 6; intWeeks++)
    {
        document.write("<TR>");
        for (var intDays = 0; intDays < days.length; intDays++)
            document.write("<TD></TD>");
        document.write("</TR>");
    }
  </SCRIPT>

  <!-- Generate today day. --></TBODY>
  <TBODY>
  <TR>
    <TD class=today colSpan=5 id=todayday onclick=getTodayDay()></TD>
    <TD align=right colSpan=2><A href="javascript&colon;HideCalendar();"><SPAN style="COLOR: black; FONT-SIZE: 10px"><B>Hide</B></SPAN></A></TD>
  </TR>
  </TBODY>

</TABLE>


</body>

</html>
Guru I
Xandrex
Posts: 18,404
Registered: ‎07-29-2008
My Device: Z30, Playbook, 9320BES
My Carrier: B&You _ SFR

Re: JavaScript not working on Black Berry Simulator 8330

hello,

on browser version 4.5 and prior, there is no dynamic javascript, meaning you can't move anything in the page once it's loaded.



The search box on top-right of this page is your true friend, and the public Knowledge Base too:
New Developer
rodrifox
Posts: 35
Registered: ‎12-22-2009
My Device: Bold 9700

Re: JavaScript not working on Black Berry Simulator 8330

And does anyone know about the Embedded Browser (net.rim.device.api.browser.field.BrowserContent)? My BB 9550 Default Browser will properly display any dynamic JavaScript as you stated, but same JavaScript will not work on the BrowserContent, even though I'm using the BrowserContent from SDK 5. Any ideas?

-------------
Rodrigo Bravo
http://www.wilkonit.com
Retired
astanley
Posts: 1,382
Registered: ‎07-02-2009
My Device: BlackBerry Bold 9900
My Carrier: Bell

Re: JavaScript not working on Black Berry Simulator 8330

Rodrigo,

 

To accomplish what you need, use the new BrowserField2 class: "net.rim.device.api.browser.field2.BrowserField".  This class uses the Mango rendering engine (introduced in version 4.6 of the handheld software) and provides the ability to develop web content that can be updated dynamically using XmlHttpRequest (AJAX) or DOM L2 access.

 

The BrowserContent demo uses the older version fo the browser rendering engine.  This version was the default rendering engine for 4.5 and remained tied to the embedded browserField (e.g. BrowserFieldDemo and BrowserContentManagerDemo) class upto and including the 5.0 JDE.

 

Here is a sample application that demonstrates how to use BrowserField2

 

 

import net.rim.device.api.browser.field2.BrowserField;
import net.rim.device.api.browser.field2.BrowserFieldConfig;
import net.rim.device.api.browser.field2.*;
import net.rim.device.api.ui.container.MainScreen;
import net.rim.device.api.system.Application;
import net.rim.device.api.ui.*;

class BrowserField2Demo extends UiApplication {

    private MainScreen _browserScreen;
    private BrowserField _bf2;
    private BrowserFieldConfig _bfConfig;
    
    BrowserField2Demo()
    {
        _browserScreen = new MainScreen();        
        _bfConfig = new BrowserFieldConfig();
        _bfConfig.setProperty( BrowserFieldConfig.NAVIGATION_MODE, BrowserFieldConfig.NAVIGATION_MODE_POINTER );
        _bfConfig.setProperty( BrowserFieldConfig.JAVASCRIPT_ENABLED, Boolean.TRUE );
        _bf2 = new BrowserField(_bfConfig);
        _browserScreen.add(_bf2);
        
        invokeLater(new Runnable() {
            public void run() {
                _bf2.requestContent("http://www.blackberry.com");
                pushScreen(_browserScreen);
            }
        });     
    }
    
    public static void main(String[] args)
    {
        BrowserField2Demo app = new BrowserField2Demo();        
        app.enterEventDispatcher();        
    }
}

 

Sincerely,

Adam

Follow me on Twitter: @n_adam_stanley
-------------------------------------------------------------------------------------------------------------------------
Your app doesn't work? Use BlackBerry remote web inspector to find out why.
New Developer
rodrifox
Posts: 35
Registered: ‎12-22-2009
My Device: Bold 9700

Re: JavaScript not working on Black Berry Simulator 8330

Adam,

 

Thanks a lot for your post. It was very helpful. I'm having a hard time now with the browser events; in the old browser field we had RenderingApplication interface and Event class, but I don't know where to start when trying to capture events in the new JDK5 BrowserField (from field2 package). I'd need to capture, for instance, when a user clicks in a link or get redirected. I don't want to use the API from the old field package since I believe I will get hardwired to the old rendering engine.

 

Could you or anybody out there point me in the right direction? I appreciate your help.

-------------
Rodrigo Bravo
http://www.wilkonit.com
Developer
robbatt
Posts: 21
Registered: ‎11-09-2009
My Device: Not Specified

Re: JavaScript not working on Black Berry Simulator 8330

[ Edited ]

Hi guys,

 

I'm also having problems with my embedded browser. I am using version 4.6 and the BrowserContentManager as in the BrowserContentManagerDemo, but cant get it to render a page like the system browser  does. Basically I am just missing the CSS functionality. Is there some clever but bad documented Flag in the RenderingOptions?

 

Cheers rob

 

Edit - Solution:

Figured out the problem:

The site I was calling had a css media type == "screen", the default for the embedded browser field is "handheld". I set the following parameter on the BrowserContentManager:

 

contentManager.getRenderingSession().getRenderingOptions().setProperty(RenderingOptions.CORE_OPTIONS_GUID, RenderingOptions.CSS_MEDIA_TYPE, "screen");

 

Hope that helps somebody.

 

Cheers

New Developer
cwhite124
Posts: 9
Registered: ‎01-09-2010
My Device: BlackBerry Curve 8530

Re: JavaScript not working on Black Berry Simulator 8330

[ Edited ]

I am trying to figure out how to catch the browser events as well.  I THINK I have figured out the correct way to do it, but unfortunately it looks like you would have to then fetch all the requested pages and resources yourself the way you have to in the browser.field object from 4.X.  Here is how I am catching some events (note that I am cutting an pasting and doing some from my head so this code has not bee explicitly compiled):

 

1. Create a class that is derived from browser.field2.BrowserFieldController

 

public class MyBrowserFieldController implements BrowserFieldController {

 public void handleNavigationRequest(BrowserFieldRequest request) throws Exception {

  // TODO Auto-generated method stub

  }


 public InputConnection handleResourceRequest(BrowserFieldRequest request) throws Exception {

 return null;

 }

}

 

2. Create an instance of browser.field2.BrowserFieldConfig and set the CONTROLLER parameter to an instance of your MyBrowserFieldController class

 

MyBrowserFieldController myBrowserFieldController = new MyBrowserFieldController();

BrowserFieldConfig browserFieldConfig = new BrowserFieldConfig();

browserFieldConfig.setProperty(BrowserFieldConfig.CONTROLLER, myBrowserFieldController);

 

3. Create an instance of browser.field2.BrowserField and give it your BrowserFieldConfig object as a parameter

 

BrowserField browserField = new BrowserField(browserFieldConfig);

 

I hope this helps!

 

Thanks!

Chris

Retired
astanley
Posts: 1,382
Registered: ‎07-02-2009
My Device: BlackBerry Bold 9900
My Carrier: Bell

Re: JavaScript not working on Black Berry Simulator 8330

Rodrigo,

 

To capture browser events using the new BrowserField object, please see the BrowserFieldListener class which  can be used to listen for specific browsing events raised by an active BrowserField component. 

You can even register multiple listeners with a given BrowserField instance.  When a browsing event occurs while rendering web content within the BrowserField instance, all registered BrowserFieldListener objects get notified.

 

Here's a code snippet of creating and adding a listener to your BrowserField:

 

MainScreen _screen = new MainScreen();
BrowserField _browserField = new BrowserField();

BrowserFieldListenenr _listener = new BrowserFieldListener() { 
     public void documentLoaded(BrowserField browserField, 
Document document) throws Exception {
//Add your code here.
} public void downloadProgress(BrowserField browserField,
ContentReadEvent event)throws Exception { //Add your code here.
} }; _browserField.addListener( _listener ); _screen.add(_browserField);

 

Chris - your sample of implementing the BrowserFieldController interface is a great way to capture when a page request is going to be made.  Thanks for providing your answer!  Please let me know if the listener class I've mentioned in this post provides you with the level of granularity that you may be looking for when capturing events?

 

Sincerely,

Adam

Follow me on Twitter: @n_adam_stanley
-------------------------------------------------------------------------------------------------------------------------
Your app doesn't work? Use BlackBerry remote web inspector to find out why.
New Developer
rodrifox
Posts: 35
Registered: ‎12-22-2009
My Device: Bold 9700

Re: JavaScript not working on Black Berry Simulator 8330

Thanks Adam. I managed to handle different browser events using a combination of what you just stated and also (and more important if you want to handle resource requests and forwards) BrowserFieldController interface.

-------------
Rodrigo Bravo
http://www.wilkonit.com
Contributor
Jeevan
Posts: 25
Registered: ‎06-30-2010
My Device: 9000 bold

Re: JavaScript not working on Black Berry Simulator 8330

Hi Adam ,

             above code is working correctly with "http://www.blackberry.com"  this url,

              in my application i want display this url contents "http://teletextholidays.mobi"  for this url its not displaying any thing . but while typing this url  into the  blackberry  browser its displaying the web page , i am not getting why its happing .. if you know please advice me. my application in final stage.

 

Thanks in Advance