Invoking Worklight Adapter and Displaying that JSON data in list view as strings

This is my adapter.impl.js code.

 //This procedure implementation is to get all the details from the table which in database.
 var procedure1Statement = WL.Server.createSQLStatement("select * from employee");
 function procedure1() {
return WL.Server.invokeSQLStatement({
    preparedStatement : procedure1Statement,
    parameters : []
});
}

This is my JSON data retrieved from SQL Adapter in worklight.

{
"isSuccessful": true,
"resultSet": [
  {
     "EMAIL": "bkandregula@gmail.com",
     "ID": 1,
     "NAME": "Bhanu Kandregula"
  },
  {
     "EMAIL": "rbkandregula@gmail.com",
     "ID": 2,
     "NAME": "Raghu Kandregula"
  },
  {
     "EMAIL": "shyamsurisetty@gmail.com",
     "ID": 3,
     "NAME": "Shyam Surisetty"
  },
  {
     "EMAIL": "bunny@gmail.com",
     "ID": 4,
     "NAME": "Bunny"
  },
  {
     "EMAIL": "divya@gmail.com",
     "ID": 5,
     "NAME": "Divya Sri"
  },
  {
     "EMAIL": "chandhu@gmail.com",
     "ID": 6,
     "NAME": "Chandana"
  }
]
}

Not I was to invoke this adapter from Client side and display this data in list view on my mobile console. For that, this is the code which I used in client side js file.

function wlCommonInit(){
LoadSQLRecords();}

function loadSQLRecords(){
var invocationData = {
    adapter : 'MySQLadap',
    procedure : 'procedure1',
    parameters : []
};

WL.Client.invokeProcedure(invocationData,{
    onSuccess : loadSQLQuerySuccess,
    onFailure : loadSQLQueryFailure
});
}

function loadSQLQuerySuccess(result) {
    WL.Logger.debug("Retrieve success" +  JSON.stringify(result));
    displayFeeds(result.invocationResult.resultSet);
}

function loadSQLQueryFailure(result) {
    WL.Logger.error("Retrieve failure");
}

function displayFeeds(items) {
    var ul = $('#itemsList');
    for (var i = 0; i < items.length; i++) {
        var li = $('<li/>').html(items[i].id);
        li.append($('<li/>').html(items[i].name));
        li.append($('<li/>').html(items[i].email));
        li.append($('<hr>'));
        ul.append(li);
    }
  }

And this my HTML file code to display my data on screen.

<div id="wrapper">
        <ul id="itemsList"></ul>
 </div>

But This is not working with me. I have been searching many blogs and sites, But I was unable to trigger this. Please do help me in invoking adapter and display that data in list view on mobile console. Thank you.

You need to correct the below and then re-deploy the application.

1. You have misspelled a function name:

   LoadSQLRecords should be loadSQLRecords.

   function wlCommonInit(){
       LoadSQLRecords(); // Upper-case 'L'; should be lower-case.
   }
   
   function loadSQLRecords(){
       var invocationData = {
           adapter : 'MySQLadap',
           procedure : 'procedure1',
           parameters : []
       };
   };
   

   You should have seen the following in the Chrome DevTools' console prior to the fix:

   worklight.js:5147 Uncaught Exception: Uncaught ReferenceError: LoadSQLRecords is not defined at (compiled_code):4
   main.js:4 Uncaught ReferenceError: LoadSQLRecords is not defined
   

2. You need to change the following in order to actually display any values.

   • use items.invocationResult.resultSet
   • use correct capitalization for the properties
     
     

   From:

   for (var i = 0; i < items.length; i++) {
       var li = $('<li/>').html(items[i].id);
       li.append($('<li/>').html(items[i].name));
       li.append($('<li/>').html(items[i].email));
       li.append($('<hr>'));
       ul.append(li);
   }
   

   To:

   for (var i = 0; i < items.invocationResult.resultSet.length; i++) {
       var li = $('<li/>').html(items.invocationResult.resultSet[i].ID);
       li.append($('<li/>').html(items.invocationResult.resultSet[i].NAME));
       li.append($('<li/>').html(items.invocationResult.resultSet[i].EMAIL));
       li.append($('<hr>'));
       ul.append(li);
   }