Home/ Questions/Q 7071705
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T05:43:12+00:00

I have a simple BlackBerry app i’m working on that uses JSONP and Zepto.js.

  • 0

I have a simple BlackBerry app i’m working on that uses JSONP and Zepto.js. Most of the code is written quickly, I haven’t made use of Zepto as I should have and will but need to just test it for now and I believe its all my code is valid so far (new to JS – just learning).

Example for index.html

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <link  rel="stylesheet" type="text/css" href="css/bbsonic.css"><link />
        <link  rel="stylesheet" type="text/css" href="css/ocssui.css"><link />
        <title>Login</title>
        <script type="text/javascript" src="js/zepto.js"></script>
    </head>
    <body>
        <div data-role="page" class="page">

            <div data-role="header" class="header">
                <div id="header-logo">
                    <table>
                        <td valign="middle" class="museo">
                            <h1>BerrySonic</h1>
                        </td>
                    </table>
                </div>
            </div><!-- /header -->

            <div data-role="content" class="content" id="list-wrapper">
                <ul data-role="listview" id="servers" class="listview">
                       <li class="title-divider">Select a Subsonic Server</li>
                </ul>
            </div><!-- /content -->

        </div><!-- /page -->   
        <script type="text/javascript" src="js/index.js"></script>
    </body>
</html>

Index.js:

var db = window.openDatabase("bbsonic", "0.1", "SubSonic Server", 1024*1000);
$(document).ready = prepareDatabase();

function prepareDatabase() {                        
    db.transaction(function(tx) {
        var starterSQL = 'CREATE TABLE IF NOT EXISTS servers (id INTEGER PRIMARY KEY AUTOINCREMENT, name VARCHAR(255) NOT NULL, url VARCHAR(255) NOT NULL, port VARCHAR(255) NOT NULL, user VARCHAR(255) NOT NULL, pass VARCHAR(255) NOT NULL)';
        tx.executeSql(starterSQL, []);
    });
    showServerList();
}

function showServerList() {                     
    db.transaction(function (tx) {
        tx.executeSql('SELECT * FROM servers', [], function (tx, results) {
            var len = results.rows.length, i;
            for (i = 0; i < len; i++) {
                var id = results.rows.item(i).id;
                var name = results.rows.item(i).name;

                var parent = document.getElementById('servers');
                var listItem = document.createElement('a');
                listItem.setAttribute('href', 'main.html');
                listItem.setAttribute('onclick', 'setServerID(' + id + ')');
                if (i == 0) {
                    listItem.innerHTML = '<li class="first-item">' + name + '</li>';
                } else {
                    listItem.innerHTML = '<li>' + name + '</li>';
                }

                parent.appendChild(listItem);
            }

            var parent = document.getElementById('servers');
            var listItem = document.createElement('a');
            listItem.setAttribute('href','addnewserver.html');
            listItem.innerHTML = "<li>Add New Server</li>";
            parent.appendChild(listItem);
        });
    });
}

function setServerID(id) {
    sessionStorage.serverID = id;
}

The config.xml (copied one from github):

<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns="http://www.w3.org/ns/widgets" 
   xmlns:rim="http://www.blackberry.com/ns/widgets" 
   version="1.0.0.0" rim:header="WebWorks Sample">

   <name>BerrySonic</name>
   <description>This is a sample application.</description>
   <content src="index.html"/>

<rim:category name="Media"/>
<rim:category name="Media"/>

    <rim:permissions>
        <rim:permit>access_shared</rim:permit>
        <rim:permit>record_audio</rim:permit>
        <rim:permit>read_geolocation</rim:permit>
        <rim:permit>use_camera</rim:permit>
        <rim:permit>read_device_identifying_information</rim:permit>
    </rim:permissions>

    <!-- 
        Universal APIs: 
            The following features are available on both Smartphone and Tablet OS
    -->
    <feature id="blackberry.app" required="true" version="1.0.0.0"/>
    <feature id="blackberry.app.event" required="true" version="1.0.0.0"/>
    <feature id="blackberry.system" required="true" version="1.0.0.0"/>
    <feature id="blackberry.system.event" required="true" version="1.0.0.0"/>
    <feature id="blackberry.ui.dialog" required="true" version="1.0.0.0"/>
    <feature id="blackberry.utils" required="true" version="1.0.0.0"/>

    <feature id="blackberry.media.camera" required="true" version="1.0.0.0"/>
    <feature id="blackberry.media.microphone" required="true" version="1.0.0.0"/>
    <feature id="blackberry.identity" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke" required="true" version="1.0.0.0"/>
    <feature id="blackberry.io.file" required="true" version="1.0.0.0"/>
    <feature id="blackberry.io.dir" required="true" version="1.0.0.0"/>

    <!-- 
        Smartphone APIs: 
            The following features are available ONLY on Smartphone
    --> 
    <feature id="blackberry.ui.menu" required="true" version="1.0.0.0"/>
    <feature id="blackberry.identity.phone" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.AddressBookArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.BrowserArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.CalendarArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.CameraArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.JavaArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.MapsArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.MemoArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.MessageArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.PhoneArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.SearchArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.TaskArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.message" required="true" version="1.0.0.0"/>
    <feature id="blackberry.message.sms" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Address" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Attendee" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Appointment" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.category" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Contact" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Memo" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Recurrence" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Reminder" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Task" required="true" version="1.0.0.0"/>

    <feature id="blackberry.audio" required="true" version="1.0.0.0"/>
    <feature id="blackberry.audio.Player" required="true" version="1.0.0.0"/>

    <feature id="blackberry.find" required="true" version="1.0.0.0"/>
    <feature id="blackberry.phone.Phone" required="true" version="1.0.0.0"/>
    <feature id="blackberry.phone.PhoneLogs" required="true" version="1.0.0.0"/>

    <feature id="blackberry.push" required="true" version="1.0.0.0"/>
    <feature id="blackberry.find" required="true" version="1.0.0.0"/>

    <access subdomains="true" uri="*"/>

</widget>

in chrome and ripple it works perfectly but on the blackberry it only loads the header but not even the unordred list! No idea how to even go about debugging it…
Help would be greatly appreciated.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’m not sure, but I think you’re not using some HTML tags incorrectly. Usually if you make a <table>, you nest a <tr> tag, then nest the <td> tag in there. Example 

    <table>
  <tr>
    <td><h1>BerrySonic</h1></td>
  </tr>
</table>

    I recommend removing the table entirely and just using the <h1> directly under <div id="header-logo">. (Unless the Zepto require that for some very odd reason. I’m not familiar with it)

    Also, your java script is creating incorrect HTML for your list. Just like with the table, the <ul> element should have <li> elements nested in them. The code in showServerList() would create HTML that looks like this:

    <a href="main.html"><li class="first-item">Server 1</li></a>
<a href="main.html"><li>Server 2</li></a>

    When you really need: 

    <li class="first-item"><a href="main.html">Server 1</a></li>
<li><a href="main.html">Server 2</a></li>

    Try making those changes and see if it fixes your rendering problems.

    • 0