Why is this array not working?

Hi I have students code here: https://studio.code.org/projects/applab/dLlOlzZArhB1ksNRijM42AqNe5aLYftZw8rgr955YkQ

Her array appears to be working in the console.log but it is not appearing the text box likes she wants it to.

This is my first year teaching AP CSP so I am learning as well. I want to know why this is not working for future reference. So that I can better teach this class next year, because when I try to figure out the problem, I can’t!
She is not taking the class for AP credit so I have finally broken down and am posting here.
Please let me know your thoughts.

Hi Bonnie -
Looks like the problem is in the order that things are done, aka the “sequencing” of the program.

You can see that the function orderDis creates the final string that contains the order. However, that function is called and executed very early in the program on line 14, well before the user has created the order and filled the array with data. Looks like line 34 is where the end screen finally gets displayed and that is a better spot to call orderDis, before the end screen appears but after the array has be populated.

Make sense?

  • Mitch

Mitch
Thank you!
That totally makes sense and I was thinking something similar. However, we have tried to move the orderDis function around and it still returns undefined. In fact, even though the console.log is reporting a populated array, if we replace the array orders [0] - [4] in the setText with order.length, it returns 1, which tells me that it thinks the only thing in the array is the first appenditem at the top of the code.

Any ideas on that?

Bonnie,

First I have to warn you that if this is the student’s program for the create performance task then the college board says “Teachers may not;”
image

and I’m afraid this would cross that line in a big big way.

So here’s the problem. First putting onEvents inside functions is dangerous business. All an onEvent does is set a “listener” that waits until the event occurs. Putting them in a function or setting up multiple onEvents for the same event (e.g. for the same button) means that there may be multiple listeners out there and all will respond to the button click and attempt to do it at the same time. This is probably not the desired outcome.

If I look at the code. All these functions do are set up onEvents:
openscreen();
ChooseYourFinding();
ChooseFinding();
chooseBead();
ColorChoices();
endScreen();

So in calling those functions nothing has happened except creating listeners. The code moves from one to another instantly and has set up listeners but the user hasn’t even clicked on a single thing yet. So what’s happening when the Run button is clicked is that all those execute and then orderDis() and calcPrice() are called and the user still has not clicked on a button. The user begins clicking and the onEvents are called and it looks like it building the strings but orderDis() and calcPrice() will never be called again. Without major revamping of the code, orderDis() and calcPrice() at least need to be moved inside this onEvent before the setScreen(“endScreen”) call:

onEvent(“nextBtn3.2”, “click”, function( ) {
setScreen(“endScreen”);
});

Disclaimer: I didn’t edit the code to test it out so I’m not sure that this will solve every problem.

My recommendation is to explain how onEvents work (you can reteach!) and point out that setting up a listener doesn’t mean the code waits for a button click. The listener is waiting but the code marches on happily. onEvents should call functions. Functions should not call onEvents.

@gjschmidt Thanks for your reply! This helps a lot. As a new teacher to this curriculum, I am never sure that I understand what is going on 100%. So this helps me explain onEvents better.

And this code is not for the Create task, which is why I felt okay in submitting it here, but thanks for putting that caveat out there!

I am glad I could help. If you need more help just let me know. onEvents are odd things and it’s a lot for a student (or teachers!) to understand the underlying mechanics.

Sorry if my warning was a bit too strong. This time of year I get leery debugging students’ code. I am and AP reader and I don’t want someone getting in trouble because we’ve helped a student more than we should.

No worries! That is a legitimate concern for sure. I really appreciate the help.