CODEWITHSUNDEEP
javascriptjquerysqlitecordovaxml-parsing
user1857654
user1857654

Reputation: 283

Phonegap/Jquery mobile Read an XML into a database and then display the data in a div

I am looking to access the information that I have stored in the databse that Ive parsed out of an XML. I am using phonegap (cordova 2.2.0). I am calling queryDB() on click on my navigation bar to call the function to populate the div with the information that was parsed from an XML. My issues is that the information is not being displayed.

Anyone have any idea why? Below is my code:

On click

<a href="#acceptedOrders" onclick("queryDB();")> <img src="Images/acceptedOrders.gif" width="25%"> </a>

This is a javascript function that reads an XML into a databse:

var db = openDatabase('PhoneGap_db', '1.0', '', 2 * 1024 * 1024);
db.transaction(function (tx) {
  tx.executeSql('CREATE TABLE IF NOT EXISTS orders (id unique, city, state, zip)');
});


db.transaction(function (tx) {
   tx.executeSql('INSERT INTO orders (id, city, state, zip) VALUES (orderId,city,state,zip)');
});

$.ajax({
    type: "GET",
    url: "testOrders.xml",
    dataType: "xml",
    success: function(xml) {
      $(xml).find('order').each(function(){
        orderId = $(this).find("orderId").text();
        city = $(this).find("city").text();
        state = $(this).find("state").text();
        zip = $(this).find("zip").text();
        db.transaction(function (tx) {
           tx.executeSql('INSERT INTO orders (id, city, state, zip) VALUES ('+ orderId +', '+ city + ', ' + state + ', ' + zip + ')');
        });
            });
        }
     });

Here is my Read Script(not working) 

function queryDB(tx) {
  tx.executeSql('SELECT orderId FROM orders', [], querySuccess, errorCB);
}
function querySuccess(tx, results) {
  var len = results.rows.length;
  for (var i=0; i<len; i++){
      $('#acceptedOrdersContent').append('<li><a href="#CompleteOrderInfo">'+results.rows.item(i).orderId+'</a></li>').listview("refresh");
  }
};
function errorCB(err) {
  console.log("Error processing SQL: "+err.code);
}

This is an example XML file: 

    <?xml version="1.0" encoding="UTF-8"?>
     <orders>
        <order>
         <orderId>123456789</orderId>
         <city>Cincinnati</city>
         <state>Ohio</state>
        <zip>45451</zip>
    </order>
 </orders>

Thanks everyone!

Upvotes: 0

Views: 1301

Answers (1)

josemando
josemando

Reputation: 573

First of all, your html is wrong, you should use onclick="" instead of onclick(""), like this:

<a href="#acceptedOrders" onclick="queryDB();">
  <img src="Images/acceptedOrders.gif" width="25%">
</a>

Also your queryDB functions is expecting a parameter that's not being passed. You should update it to something like this:

function queryDB() {
  db.transaction(function (tx) {
    tx.executeSql('SELECT orderId FROM orders', [], querySuccess, errorCB);
  });
}

Keep in mind that this should be in the same context where db object was created

Upvotes: 1

Related Questions