JSON does not recognize an internal object

Question

JSON does not recognize an internal object

Navigation

#1 by (0 votes)

1

I am creating a menu dynamically by means of a function, this function must receive as a parameter a JSON that will contain all the structure and hierarchies of the menu, the problem that when concatenating tells me that an internal element of the JSON does not he recognizes it.

I'm going to leave the code, I hope someone can help me

function CrearMenu(caja, objeto) {

  var esqueleto = '<nav clase="nav"><ul clase="Menu">';

  var Primer_Nivel = Object.keys(objeto).length;

  for (var i = 0; i <= Primer_Nivel; i++) {
    esqueleto = esqueleto + '<li><a href="' + objeto[i].href + '">' + objeto[i].titulo + '</a></li>'

    //alert(objeto[i]);
  }

  esqueleto = esqueleto + '</ul></nav>';
  $(caja).append(esqueleto);
}
$(document).ready(function() {

  var obj = [{
      "titulo": "Fernando",
      "href": "#",
      "submenu": [{
          "titulo": "Vannesa",
          "href": "#",
          "submenu": []
        },
        {
          "titulo": "Martha",
          "href": "#",
          "submenu": []
        },
        {
          "titulo": "Guiocasta",
          "href": "#",
          "submenu": [{
              "titulo": "Karen",
              "href": "#",
              "submenu": []
            },
            {
              "titulo": "Jessica",
              "href": "#",
              "submenu": []
            }
          ]
        }
      ]
    },
    {
      "titulo": "Jennifer",
      "href": "#",
      "submenu": []
    },
    {
      "titulo": "Lucia",
      "href": "#",
      "submenu": []
    }

  ];
  CrearMenu("#caja", obj);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div id="caja">
</div>

The problem is that when I execute it says that href is not defined and if I remove it, it says the same but with title.

javascript jquery

asked by Fernando Castro Martinez 14.08.2017 в 20:30

source

1 answer

How do I duplicate the records of a table, modifying the data of a column? Cycle with 2 counters in Java [closed]

score 0 · Accepted Answer

Your problem is that you are traversing the objects in the array until i is less than or equal to Primer_Nivel .

You have to remember that the arrays start from position 0 so you'll have to go through the loop from 0 to 2, that is, when i is less than Primer_Nivel .

The error that is giving you is that you are trying to access position 3 of the array objeto , which does not exist, since it only contains positions 0, 1 and 2.

Your corrected example:

function CrearMenu(caja, objeto) {

  var esqueleto = '<nav clase="nav"><ul clase="Menu">';

  var Primer_Nivel = Object.keys(objeto).length;

  for (var i = 0; i < Primer_Nivel; i++) {
    esqueleto = esqueleto + '<li><a href="' + objeto[i].href + '">' + objeto[i].titulo + '</a></li>'

    //alert(objeto[i]);
  }

  esqueleto = esqueleto + '</ul></nav>';
  $(caja).append(esqueleto);
}
$(document).ready(function() {

  var obj = [{
      "titulo": "Fernando",
      "href": "#",
      "submenu": [{
          "titulo": "Vannesa",
          "href": "#",
          "submenu": []
        },
        {
          "titulo": "Martha",
          "href": "#",
          "submenu": []
        },
        {
          "titulo": "Guiocasta",
          "href": "#",
          "submenu": [{
              "titulo": "Karen",
              "href": "#",
              "submenu": []
            },
            {
              "titulo": "Jessica",
              "href": "#",
              "submenu": []
            }
          ]
        }
      ]
    },
    {
      "titulo": "Jennifer",
      "href": "#",
      "submenu": []
    },
    {
      "titulo": "Lucia",
      "href": "#",
      "submenu": []
    }

  ];
  CrearMenu("#caja", obj);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div id="caja">
</div>