Methods cg-select complted

This commit is contained in:
Макс Овсяников 2022-09-26 17:00:15 +03:00
parent 565f80280d
commit f106116b8b
3 changed files with 44 additions and 9 deletions

View File

@ -4,8 +4,6 @@ export class DropDown {
#options;
#caret;
//ToDo: Added url
constructor(options = {}) {
this.#init(options);
this.#initAmount();
@ -49,7 +47,6 @@ export class DropDown {
this.#createSelected(this.#options.placeholder);
this.#customStyles(styles);
} else {
this.#createSelected('Select...');
this.#customStyles(styles);
}
@ -106,10 +103,18 @@ export class DropDown {
items.map((item) => {
let li = document.createElement('li');
const text = document.createTextNode(item);
li.classList.add('list__item');
if (typeof item == 'object') {
const text = document.createTextNode(item.value);
li.classList.add('list__item');
li.appendChild(text);
} else {
const text = document.createTextNode(item);
li.classList.add('list__item');
li.appendChild(text);
}
ul.appendChild(li);
});
}
@ -251,4 +256,10 @@ export class DropDown {
this.#render(select);
}
getElement(number) {
const { items } = this.#options;
return items[number];
}
}

View File

@ -13,7 +13,7 @@
<div class="cg-dropdown2"></div>
<!-- <div class="cg-dropdown3"></div> -->
<div class="cg-dropdown3"></div>
</div>
</body>
<script type="module" src="index.js"></script>

View File

@ -10,7 +10,7 @@ dropdown.addItem('ZAZ');
const dropdown2 = new DropDown({
selector: '.cg-dropdown2',
selected: '...',
placeholder: 'Выберите авто',
items: ['BMW', 'Opel', 'Mersedes', 'MAN', 'Kamaz'],
event: 'mouseenter',
styles: {
@ -34,7 +34,31 @@ const dropdown2 = new DropDown({
});
dropdown2.addItem('LADA');
dropdown2.selectIndex(3);
// dropdown2.selectIndex(3);
const dropdown3 = new DropDown({
selector: '.cg-dropdown3',
items: [
{
id: '186',
value: 'A008',
},
{
id: '288',
value: 'BMW',
},
{
id: '355',
value: 'MAN',
},
],
});
let a = dropdown3.getElement(0);
console.log(a);
let b = dropdown.getElement(0);
console.log(b);
// dropdown2.deleteItemAll();