Хотел сделать общий каскадный выпадающий список, но я слаб в рекурсии
Код должен заканчиваться
- Один выбор для предметов — одежды или гаджетов — когда выбор сделан
- One select with either Levis/Gucci or LG/Apple - when a choice is made
- One select with either Levis jeans or jackets or Gucci shoes or dresses - when a choice is made
- One select with Levis jeans sizes OR levis jacket sizes OR
- One select with Gucci shoe sizes OR Gucci dress sizes
OR
- One select with either LG TVs or phones or Apple Macbooks or iPhones - when a choice is made
- One select with LG TV sizes OR LG Phone sizes OR
- One select with Apple Macbook sizes OR Apple iPhone sizes
Я потерял ход мыслей, когда мне пришлось фактически рекурсировать - или, возможно, можно использовать фильтрацию?
Я предполагаю, что можно создать набор путей, а затем просто показать/скрыть в зависимости от пути
const selObject = {
"-- Select Item --": {
"Clothes": {
"-- Select brands --": {
"Levis": {
"-- Select product --": {
"Jeans": {
"-- Select size --": [
"38",
"39",
"40"
]
},
"Jackets": {
"-- Select size --": [
"41",
"42",
"43"
]
}
}
}, // end Levis
"Gucci": {
"-- Select product --": {
"Shoes": {
"-- Select size --": [
"45",
"50",
"55"
]
},
"Dresses": {
"-- Select size --": [
"8",
"9",
"10"
]
}
}
} // end Gucci
} // end brands
}, // End clothes
"Gadgets": {
"-- Select brands --": {
"LG": {
"-- Select product --": {
"TVs": {
"-- Select size --": [
"38",
"39",
"40"
]
},
"Phones": {
"-- Select size --": [
"8",
"9",
"10"
]
}
}
}, // end Levis
"Apple": {
"-- Select product --": {
"Macbooks": {
"-- Select size --": [
"15",
"17",
"21"
]
},
"iPhones": {
"-- Select size --": [
"8",
"9",
"10"
]
}
}
} // end Apple
} // end brands
} // end Gadgets
} // end items
} // end
function createSel(obj) {
Object.keys(obj).forEach(function(item) {
if (typeof obj[item] == "object") {
var list = obj[item];
//console.log(item,typeof list);
if (typeof list == "object") {
if (list.length) {
list.forEach(function(val) {
console.log('<br/>'+val)
})
}
else createSel(list)
}
} else {
console.log("no", obj[item])
}
});
}
window.onload = function() {
createSel(selObject)
}
<form name="myform" id="myForm">
<div id="selContainer">
</div>
</form>
-- Select Item --
и т. д. всегда были «на один уровень выше»? Я предполагаю, что первый выбор должен отображать три параметра «-- Select Item--», «Одежда» и «Гаджеты», верно? Сначала как заполнитель, другие как действительные варианты. Я полагаю, было бы проще, если бы у вас были эти три на одном уровне в вашей структуре данных для начала. - person 04FS   schedule 15.02.2019