CODEWITHSUNDEEP
javascriptjquery
tanawat yakit
tanawat yakit

Reputation: 62

Uncaught TypeError: Cannot read property 'xxxx' of undefined, But it's defined

I having trouble with this problem for hours ago. I wrote these in my Jquery function to check Value in Variable if it's exist or not.

console.log("in tr");
console.log(tmpRoomlistArray[c].room_name);
let roomName = tmpRoomlistArray[c].room_name;

When I ran and looked at Google Chrome Console. It shows results like this.

Rome  <<< In console.log It shows valid value                                   
in tr                                                       
Uncaught TypeError: Cannot read property 'room_name' of undefined << 
This is what happen when I assign in to a variable and this is what I need

What happen ?? I'm blind right now..

edit : edit question content

Upvotes: 3

Views: 1182

Answers (3)

tanawat yakit
tanawat yakit

Reputation: 62

I already solved it. It just a silly problem that I overlooked. It's about array index.

I just put 

tmpRoomlistArray[c-1]

into my function and it worked. I think the solution is just rest more, So you could see the problem more clearly.

For those who want to know what happen just read it below.

I got a function that insert row in table, and this function have 2 parameters, which is an array. So this function will insert row continuously into the table. It won't stop until it reach the end of the array.

var day = ["1","2","3"];
var room = ["room1","room2","room3",....,"room16"] // 16 Elements;
var timeForHeader = ["08:00","09:00",....."20:00"] // 25 Elements; 

function addRow(paramDay,paramRoom){ 
 // this function will create many rows depends on paramRoom length and columns depends on length of time header.
   var dayLength = day.length;
   var roomLength = room.length;
   var timeForHeaderLength = timeForHeader.length;
   for(var i = 0; i < dayLength; i++)
   {
      // this is for rows
       for(var c = 0; c < timeForHeaderLength+1; c++)
       {
          // I made c +1 timeForHeaderLength because I want a header 
          //this is for column
          if(c == 0)
          { 
            // if c == 0 mean I will insert a header row element in my table
             var tr = $("<tr/>");
             var td = $("<td/>",{text:timeForHeader[0]+" - "+timeForHeader[1]}).appendTo(tr);
             ...
             ...
             var td23 = $("<td/>",{text:timeForHeader[23]+" - "+timeForHeader[24]}).appendTo(tr);
             $("#mytableId").append(tr);
          }else{
            // this row that contain room's name and content
            // and this is the part that cause me a problem.
            // in this else condition c must be 1-17 so when I access to tmpRoomlistArray that contains 16 Element
            // So right now You guys should know right. The tmpRoomlistArray's index must be 0 - 16


            // it worked when c is between 1 - 16, But it didn't work on the last c cause c is equal to 17
             console.log(tmpRoomlistArray[c].room_name);
            let roomName = tmpRoomlistArray[c].room_name;
            //It should be 
            let roomName = tmpRoomlistArray[c-1].room_name;
            // Hahahahahahahahahahahahahahahahahhaha
          }              
       }

   }
}

Upvotes: 1

Dave
Dave

Reputation: 483

Use var instead of let?

Could let be looking for something more strongly typed?

Upvotes: 0

Swati Maheshwari
Swati Maheshwari

Reputation: 85

tmpRoomlistArray[c] is coming as undefined.

Try to print:

  console.log(tmpRoomlistArray[c]);

or

 console.log(tmpRoomlistArray);

instead of 

console.log(tmpRoomlistArray[c].room_name);

You can also use 

  debugger

in javascript code to watch value of array.

Upvotes: 0

Related Questions