Issue with object property '0' of undefined

Question

My code yields the following error:

Uncaught TypeError: Cannot set property '0' of undefined

First, here's the screenshot of the table

Note: This table are the assigned work schedule of the student.

Let's proceed to my code:

function saveWorkSched(){
    // listWorkSched
    var arr=[];
    var getSAWorkSched=[[],[]];
    var wsCounter=0;
    var wsCounter2=0;
    var j = 0;

    $("#listWorkSched td").each(function(){
      arr.push($(this).text());
    });
      console.log(arr);
    for(j;j<arr.length;j++){
      if(wsCounter2<=2){
        getSAWorkSched[wsCounter][wsCounter2]=arr[j];
        wsCounter2++;
      }else{
        wsCounter++;
        wsCounter2=0;
        getSAWorkSched[wsCounter][wsCounter2]=arr[j];
        wsCounter2++;
      }
    }
  }

1st phase: after the user create the work schedule this will be stored in arr variable.

2nd phase: the arr value will converted to multi-dimensional array and will be stored in getSAWorkSched variable

after the 3rd loop an error will occurred. it means that every time I create a work schedule more than 2 the error will trigger.

else{
        wsCounter++;
        wsCounter2=0;
        getSAWorkSched[wsCounter][wsCounter2]=arr[j]; // Here's the code where the error specified based on the console of my browser
        wsCounter2++;
      }

Answer 1

You need to define the nested array that you try to access. It really comes down to the same principle: you address the following:

    getSAWorkSched[wsCounter][wsCounter2]

... with a wsCounter value that is eventually getting to 2, but you have only defined two nested arrays in the initialisation of getSAWorkSched , so getSAWorkSched[2] does not exist -- it will give you undefined . Trying to get an array element from nothing ( undefined ) is not possible. So add this line before it in the else bock:

    getSAWorkSched[wsCounter] = []; // <--- Add this
    getSAWorkSched[wsCounter][wsCounter2]=arr[j];

More elegant code

You could use $.map and slice to write this in a more elegant way:

function saveWorkSched() {
    var arr = $.map($("#listWorkSched td"), function (td) {
        return $(td).text();
    });
    var getSAWorkSched = [];
    for (var j = 0; j < arr.length; j += 3) {
        getSAWorkSched.push(arr.slice(j, j + 3));
    }
}