skip to Main Content

I’ve got a problem reading a multidimensional array in JavaScript.

On my web page, the user clicks on a web link to display another page. I want ma program to :

• read the URL;

• extract the page name;

• search for the page name in a multidimensional array;

• display the same page, but with the text and images listed in the array.

To do this, a function reads a JSON file and populates a multidimensional array with the read data:

$.getJSON('includes/pages.json', function(data) { 
                    
  nombre_appareils = 0; 
                    
  for (key in data.APPAREILS) { //Counts the entries in the JSON file.
       nombre_appareils++;
  }
                    
 for (var i = 0; i < nombre_appareils; i++) { 
       tableau_appareils[i] = [];
 }
                    
                
for (key in data.APPAREILS) {
    //Stores each entry in th .json in tableau_appareils[][].

    tableau_appareils[key]['publication'] = data.APPAREILS[key].PUBLICATION; 
    tableau_appareils[key]['url'] = data.APPAREILS[key].URL;
    tableau_appareils[key]['marque'] = data.APPAREILS[key].MARQUE;
    tableau_appareils[key]['titre'] = data.APPAREILS[key].TITRE;
    tableau_appareils[key]['sous-titre'] = data.APPAREILS[key].SOUS_TITRE;
    tableau_appareils[key]['image1'] = data.APPAREILS[key].IMAGE1;
    tableau_appareils[key]['texte-image1'] = data.APPAREILS[key].TEXTE_IMAGE1;
    tableau_appareils[key]['image2'] = data.APPAREILS[key].IMAGE2;
    tableau_appareils[key]['texte-image2'] = data.APPAREILS[key].TEXTE_IMAGE2;
    tableau_appareils[key]['image3'] = data.APPAREILS[key].IMAGE3;
    tableau_appareils[key]['texte-image3'] = data.APPAREILS[key].TEXTE_IMAGE3;
    tableau_appareils[key]['image4'] = data.APPAREILS[key].IMAGE4;
    tableau_appareils[key]['texte-image4'] = data.APPAREILS[key].TEXTE_IMAGE4;
    tableau_appareils[key]['image5'] = data.APPAREILS[key].IMAGE5;
    tableau_appareils[key]['texte-image5'] = data.APPAREILS[key].TEXTE_IMAGE5;
    tableau_appareils[key]['image6'] = data.APPAREILS[key].IMAGE6;
    tableau_appareils[key]['texte-image6'] = data.APPAREILS[key].TEXTE_IMAGE6;
    tableau_appareils[key]['image7'] = data.APPAREILS[key].IMAGE7;
    tableau_appareils[key]['texte-image7'] = data.APPAREILS[key].TEXTE_IMAGE7;
    tableau_appareils[key]['image8'] = data.APPAREILS[key].IMAGE8;
    tableau_appareils[key]['texte-image8'] = data.APPAREILS[key].TEXTE_IMAGE8;
    tableau_appareils[key]['image9'] = data.APPAREILS[key].IMAGE9;
    tableau_appareils[key]['texte-image9'] = data.APPAREILS[key].TEXTE_IMAGE9;
    tableau_appareils[key]['image10'] = data.APPAREILS[key].IMAGE10;
    tableau_appareils[key]['texte-image10'] = data.APPAREILS[key].TEXTE_IMAGE10;
    tableau_appareils[key]['image11'] = data.APPAREILS[key].IMAGE11;
    tableau_appareils[key]['texte-image11'] = data.APPAREILS[key].TEXTE_IMAGE11;
    tableau_appareils[key]['image12'] = data.APPAREILS[key].IMAGE12;
    tableau_appareils[key]['texte-image12'] = data.APPAREILS[key].TEXTE_IMAGE12;
    tableau_appareils[key]['image13'] = data.APPAREILS[key].IMAGE13;
    tableau_appareils[key]['texte-image13'] = data.APPAREILS[key].TEXTE_IMAGE13;
    tableau_appareils[key]['image14'] = data.APPAREILS[key].IMAGE14;
    tableau_appareils[key]['texte-image14'] = data.APPAREILS[key].TEXTE_IMAGE14;
    tableau_appareils[key]['image15'] = data.APPAREILS[key].IMAGE15;
    tableau_appareils[key]['texte-image15'] = data.APPAREILS[key].TEXTE_IMAGE15;
    tableau_appareils[key]['texte-general'] = data.APPAREILS[key].TEXTE_GENERAL;
   }
                        
 })

This part of the program works. When I put this code line in the function :

console.log(tableau_appareils);

The tableau_appareils array is populated with all the data from de JSON file:

0 : [publication: 'o', url: 'aires_35iiic', marque: 'Aires', titre: 'Aires 35 III-C', sous-titre: 'Un clone de Leica M3 sans objectif interchangeable', …]
1 : [publication: 'n', url: 'aires_radar_eye', marque: 'Aires', titre: 'Aires Eye-Radar', sous-titre...

In another function, I want to find the new_url in the ‘url’ field of each entry of the array and get this entry number. I wrote:

for (var i = 0; i < nombre_appareils; i++) {
            
    if (tableau_appareils[i]['url'] == new_url) {
            number = i;
            break;
    }
            
}

In the console, I get an error message:

Uncaught TypeError: Cannot read properties of undefined (reading '0')

Any idea of what I’m doing wrong?

Thanks!

2

Answers


  1. By Looking at your code I feel
    The error message you’re encountering, "Uncaught TypeError: Cannot read properties of undefined (reading ‘0’)," suggests that tableau_appareils[i] is undefined at some point during the loop iteration. This happens when there is no matching url in the array, and you’re trying to access an element that doesn’t exist.

    To avoid this error, you should check whether tableau_appareils[i] exists before accessing its properties. You can do this using an if statement to ensure that the index i is within the bounds of the array length. Here’s the modified code:

    var number = -1; // Initialize number to -1 (or any other value you prefer) to indicate no match found initially.
    
    for (var i = 0; i < nombre_appareils; i++) {
        if (tableau_appareils[i] && tableau_appareils[i]['url'] == new_url) {
            number = i; // Store the index if a match is found.
            break;
        }
    }
    
    if (number !== -1) {
        console.log('Match found at index:', number);
    } else {
        console.log('No match found.');
    }
    

    do let me know if i have understood your requirement wrong.

    Login or Signup to reply.
  2. Your message indicates that tableau_appareils is not defined in the second snippet. It was local to the first snippet.

    If you debug your code line by line, you should see this.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search