Post AP Data Tools, Lessons 8 and up... Data not being read

This comes from lesson 8 of the Post AP Data Tools Unit. There seems to be a bug, or am I doing something wrong? HELP!!!

When the following code is run:

readRecords(“myTable”, {}, function(records){
console.log(records);
});

The console.log looks like this:
[Object, Object, Object, Object]

Instead of the actual data from the table, “myTable” which involves cities and populations. Is this a bug in the system?

That is normal behavior. readRecords retruns an array of JSON objects. If you want to see what is inside the objects you need to loop through the array and log each object.

Or you can use a breakpoint and look at the array and objects interactively in the console. A little known feature is that when you click on an object in the console it shows all the properties in a more table like format.

Here’s my latest error from 3 different students - ERROR: Line: 32: TypeError: contacts[currentIndex] is undefined

var currentIndex = 0;
var contacts = ;

readRecords(“myContacts”, {}, function(records){
contacts = records;
showCurrentContact();
});

showCurrentContact();

onEvent(“viewContactsScreen”, “keydown”, function(event) {
if(event.key == “Left”){
currentIndex–;
currentIndex = wrap(currentIndex, 0, contacts.length-1);
showCurrentContact();
} else if (event.key == “Right”){
currentIndex++;
currentIndex = wrap(currentIndex, 0, contacts.length-1);
showCurrentContact();
}
});

onEvent(“addContactBtn”, “click”, function() {
setScreen(“addContactsScreen”);
});

onEvent(“backBtn”, “click”, function() {
setScreen(“viewContactsScreen”);
});

function showCurrentContact(){
var EntireName = "Name: " + (contacts[currentIndex].name);
var FullPhone = "Phone: " + (contacts[currentIndex].phone);
var FullBirthday = "Birthday: " + (contacts[currentIndex].birthday);
setText(“contactInfo”, (EntireName + ‘\n’) + FullPhone + ‘\n’ + FullBirthday);
setImageURL(“contactImage”, (contacts[currentIndex].imageURL));
}

function wrap(val, low, high){
var output;
if(val < low){
output = high;
} else if (val > high){
output = low;
} else {
output = val;
}
return output;
}
onEvent(“saveContactBtn”, “click”, function() {
var newerContact = {};
newerContact.name = getText(“nameInput”);
newerContact.phone = getText(“phoneInput”);
newerContact.birthday = getText(“birthdayInput”);
newerContact.imageURL = getText(“URLinput”);
appendItem(contacts, newerContact);

setText(“nameInput”, “”);
setText(“phoneInput”, “”);
setText(“birthdayInput”, “”);
setText(“URLinput”, “”);

currentIndex = contacts.length - 1;
showCurrentContact();

setScreen(“viewContactsScreen”);
createRecord(“myContacts”, newerContact, function(){

});
});
onEvent(“URLinput”, “input”, function() {
setImageURL(“previewImage”, getText(“URLinput”));
console.log("URLinput entered text: " + getText(“URLinput”));
});

Read the code from top to bottom ignoring the callback functions. You do that because you don’t know when or even if the callback will be called. Let’s apply that idea.

var currentIndex = 0;
var contacts = [];

readRecords(“myContacts”, {}, );

showCurrentContact();

Read through this code now. What would you expect the first value of the array contacts to be? There isn’t any is there? So when you try to do something, anything with contacts[currentIndex] you would expect an error. That is exactly what you get.

We need to remember that a callback makes no guarantee to run, let alone running before the next line of code is executed. Always assume it will not.