Alguien me guía, ¿Cómo crear el menú desplegable dinámico usando la siguiente matriz/JSON en javascript?
[ { "1": "001", "2": "002", "3": "003" } ];Que he hecho :
let text = "<select class='form-control'><option value=''>All</option>"; var array = [ { "1": "001", "2": "002", "3": "003" } ]; for (var i = 0; i < array.length; i++) { // POPULATE SELECT ELEMENT WITH JSON. text += '<option value=' + array[i]["1"] + '>'+ array[i]["1"] +'</option>'; }Creando el elemento Seleccionar usando JavaScript:
<!DOCTYPE html> <html> <body> <p>Click the button to create a SELECT and an OPTION element.</p> <button onclick="myFunction()">Try it</button> <script> const customItems = [ { "1": "001", "2": "002", "3": "003" } ]; function myFunction() { const x = document.createElement("SELECT"); x.setAttribute("id", "mySelect"); document.body.appendChild(x); for (let i = 0; i < customItems.length; i++) { for (let key in customItems[i]) { const z = document.createElement("option"); z.setAttribute("value", customItems[i][key]); const t = document.createTextNode(customItems[i][key]); z.appendChild(t); document.getElementById("mySelect").appendChild(z); } } } </script> </body> </html>use Object.entries() para leer el campo en el objeto.
var array = [ { "1": "001", "2": "002", "3": "003" } ]; var x = document.createElement("SELECT"); x.setAttribute("id", "mySelect"); document.body.appendChild(x); for (const [key, value] of Object.entries(array[0])) { var z = document.createElement("option"); z.setAttribute("value", key); var t = document.createTextNode(value); z.appendChild(t); document.getElementById("mySelect").appendChild(z); }