0

I am creating a multidimensional array and adding a specific part of the array in to a variable. The math is coming out right and works every time, but I am getting an Uncaught type error every time I do it. Specifically it says this.

 Uncaught TypeError: Cannot read property '2' of undefined 

Here is the while loop that it is happening in.

while (i <= theAgents[agentNumber].length) { var comm = theAgents[agentNumber][i][2]; commTotals += comm; console.log(commTotals); $(this).parent().find("#productionTotals").text(commTotals); i++ }; 

And here is the section of the code in it's entirety

 $("body").on("click", "#agentButton", function(event) { // v1-1 creating an array to put all of the deal info in to so that I can push it to the theAgents array var theNewDeal = []; var totalDeals = 0; var i=0; var commTotals = 0; var newDealAddress = prompt('Enter the property address'); var newDealContractDate = prompt('Enter the contract date'); var newDealProduction = prompt('Enter the purchase price'); var newDealCommission = prompt('Enter the commission'); newDealProduction = parseInt(newDealProduction); newDealCommission = parseFloat(newDealCommission); var CommissionRate = newDealCommission/100; var newDealGCI = newDealProduction * CommissionRate; $(this).parent().find("#address").val(newDealAddress); $(this).parent().find("#production").val(newDealProduction); $(this).parent().find("#contractDate").val(newDealContractDate); $(this).parent().find("#commission").val(newDealCommission); $(this).parent().find("table.agent").append("<tr><td>"+newDealAddress+"</td><td>"+newDealContractDate+"</td><td class='production'"+ "contentEditable='true'>$"+newDealProduction+"</td><td class='commission'>"+newDealCommission+"%</td><td>$"+newDealGCI+"</td></tr>"); //This is the push to theNewDeal array theNewDeal.push(newDealAddress, newDealContractDate, newDealProduction, newDealCommission, newDealGCI); console.log(theNewDeal); agentCommission.push(newDealProduction); //Writing out the data-agent value to figure out how to get it so I can link the correct button to the right table. var agentNumber = $(this).attr("data-agent"); //pushing data in to the proper theAgents array location. theAgents[agentNumber].push(theNewDeal); console.log("He has this many deals", theAgents[agentNumber].length+" And his agent number is "+agentNumber); console.log(theAgents); //This is where I make the text of the total production table equal to the while loop above. $(this).parent().find("#productionTotals").text(agentCommission); //while loop to add up total commissions of each agent every time a new deal is put in. Added in 1-2 while (i <= theAgents[agentNumber].length) { var comm = theAgents[agentNumber][i][2]; commTotals += comm; console.log(commTotals); $(this).parent().find("#productionTotals").text(commTotals); i++ }; 

The code executes just fine and works every time, but for some reason in Chrome I am getting that error. That is causing the code to shut down and not work for anything after the while loop. I have a few others that I have to create for different parts of the array, so any guidance on why it is popping up would be great!

Here is a JSFiddle of the whole project so you can see the whole thing without me posting it here. Thanks!

4 Answers 4

3

Off by one error, index starts at zero.

while (i <= theAgents[agentNumber].length) { ^^^^ 

needs to be

while (i < theAgents[agentNumber].length) { ^^^^ 
Sign up to request clarification or add additional context in comments.

1 Comment

this worked like a charm. So just to be clear.. because the index of the array starts at 0 it will be one less than the length so it can't equal the length. I was looking at the wrong 2. That was really throwing me off, but it makes a lot of sense now. Thanks!
1
while (i < theAgents[agentNumber].length) { var comm = theAgents[agentNumber][i][2]; commTotals += comm; console.log(commTotals); $(this).parent().find("#productionTotals").text(commTotals); i++ }; 

i should be less than length as it starts with 0.

Comments

0

Check if there is theAgents[agentNumber], than check if there is theAgents[agentNumber][i] then get value of theAgents[agentNumber][i][2] or set comm to 0

while (i <= theAgents[agentNumber].length) { var comm = (theAgents[agentNumber] && theAgents[agentNumber][i] && theAgents[agentNumber][i][2]) || 0; commTotals += comm; console.log(commTotals); $(this).parent().find("#productionTotals").text(commTotals); i++ }; 

3 Comments

Could you explain the '(theAgents[agentNumber] && theAgents[agentNumber][i] && theAgents[agentNumber][i][2]) || 0);' section of the code. I am not exactly sure what that is doing or what it's purpose is. Thanks!
E.g. you have nested object var a = {b: {c: 'd'}} - try to get access to key c - console.log(a.b.c) - but what happens if b will be not available? TypeError: Cannot read property 'd' of undefined – how to prevent it? You can chack is each value avaible - if(a) {if(a.b) {if(a.b.c) {console.log('hooray')}}}. Who want to write that code? Developers are lazy. According to my first comment operaotr && works in the same way as nesteds if. Operator || returs second argument if both of them are falsy values
great - thanks for that insight, I appreciate it. Will keep that in mind for the future!
0
while (i <= theAgents[agentNumber].length) // should be < and not <= 

because:

var arr = [1,2,3] arr.length === 3 // true arr[3] === undefined // true 

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.