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.
I just found this discussion as I had the same problem.
I had added a call to showCurrentContact inside the readRecords callback function. But there was still another one in the main body of the program. Once I removed this other call the program worked (thanks jdonwells).
I checked and this line is present from the beginning of the linked task (lesson 8 step 8) and the instructions at lesson 10 step 9 don’t say to remove it. Perhaps the instructions should say to move it so it’s inside the callback function.
I hope I’ve sussed this out correctly. I’ve submitted it using the “Report a Problem” link.